liveBook · Manning

Custom comparison method

As explained in Build a Frontend Web Framework (From Scratch)

A custom comparison function is a function that determines equality according to criteria defined for the compared values rather than relying on reference identity.

A custom comparison method decides whether two values should count as equal according to their contents or domain meaning. This matters when JavaScript objects represent virtual nodes: two separate objects can describe the same node, even though === returns false. section 7.6.4

Use the comparison method as the equality policy for an array-diff algorithm:

  • Pass equalsFn into the array wrapper and default it to (a, b) => a === b for primitive-value tests. section 7.6.4
  • Use equalsFn when detecting removals, no-op matches, additions, and moved items. section 7.6.4
  • Keep comparison separate from array mutation so the same diff mechanism can work with strings or virtual nodes. section 7.6.4

Reference identity versus value equality

const a = { foo: 'bar' } const b = { foo: 'bar' } console.log(a === b) // false A custom comparator can instead treat these objects as equal when their relevant properties match. section 7.6.4

How Build a Frontend Web Framework (From Scratch) covers it

How deep it goes
Explains the comparison hook’s role across diff operations but defers the virtual-node equality implementation.
Examples
Uses two structurally identical objects and an array-diff function whose equalsFn defaults to ===.
What it assumes
Assumes basic JavaScript functions and objects while establishing reference equality from a concrete example.
What you can do after
Apply it via a comparator parameter to make array-diff operations recognize domain-level equality.
How it connects
Connects JavaScript equality, reference identity, virtual nodes, array diffing, and reconciliation.

Also explained in

Compare how 2 books explain custom comparison method →

Related concepts

This explainer was generated by Manning's knowledge graph from the text of Build a Frontend Web Framework (From Scratch). The section links point to the parts of the book it draws on.