In a nutshell
When you update a slice of React context, React will trigger a re-render of all consumers of that context (i.e., any component that invokes
useContext(someContext)) regardless of whether they use the updated slice. This can cause a lot of unnecessary re-renders and potentially performance issues.
View this Codesandbox to see this in action.
- I think this re-rendering of all consumers only happens if you use a non-primitive value as your context. When React compares the context values using
Object.is, the comparison will always fail for non-primitives like objects, hence the re-renders. In reality, you typically use objects as context values so the re-render problem still applies. Need to check this.