React Context: When Are Children Re-Rendered?
3) Which leads to the Provider and all its descendants re-rendering anyways
While this is the default behavior, in practice it's common to change this in order to improve performance. Pure components, components that implement shouldComponentUpdate, or components using React.memo will cause the rerendering to stop before going through the entire tree.
For example: suppose there's a toplevel component with some state, which renders a midlevel component that has shouldComponentUpdate() { return false; }
, which renders a bottom level component. On the initial mount, all 3 of these will render. But then if the toplevel component updates its state, only the toplevel component will rerender. The midlevel component will be skipped due to its shouldComponentUpdate, and then the bottom level component is never even considered.
Now we add in a context provider to the toplevel component, and a context consumer to the bottom level component. On the initial mount, they will again all render. If the toplevel component updates its state, it will rerender. The midlevel component will still skip its render, due to its shouldComponentUpdate. But as long as the context value changed, the bottom level component will rerender, even though its parent bailed out. This is the feature that is referred to by that blurb.