Splitting Contexts to Limit Re-renders
Separate frequently-changing values from stable ones into different contexts.
Welcome
In this lesson you will learn to split React Contexts into separate providers to minimise re-renders when only part of the context value changes.
The Re-render Problem with Context
Every component that calls useContext(MyCtx) re-renders when ANY part of the context value changes — even if the part they use did not change. A single large context can cause many unnecessary re-renders.
All lessons in this course
- Splitting Contexts to Limit Re-renders
- Memoizing Context Values with useMemo
- Context Selector Pattern
- When Not to Use Context