[2020-04-15] Shallow Comparison 101
The notes below are in the context of React (
shouldComponentUpdate in particular) but the underlying idea is the same everywhere. When comparing previous props and state to next, a shallow comparison will check that primitives have the same value (eg,
1 or that
You’ve probably been hearing not to mutate objects and arrays in props and state. If you were to mutate objects in a parent component, your “pure” child components wouldn’t update. Although the values have changed upstream, the child would be comparing the reference to the previous props and not detect a difference.
Instead, return new objects when you make a change by either leveraging ES6 for object and array spreading or using a library to enforce immutability.