Re-renders only affect the component that owns the state + its descendants (if any).

When a component re-renders, it tries to re-render all descendants, regardless of whether they're being passed a particular state variable through props or not. [... Because] it's hard for React to know, with 100% certainty, whether another component depends, directly or indirectly, on the updated state variable.

In an ideal world, React components would always be “pure”. A pure component is one that always produces the same UI when given the same props.

A tweak is to declare a component with React.memo. If the props have changed, React will re-use that current component rather than going through the trouble of generating a brand new one.

Some argue that rerender is cheap too.