Centralizing update logic
A reducer is a function that takes the current state and an action and returns the next state. Pairing it with context lets a whole subtree read the state and dispatch actions without prop drilling. The reducer concentrates all transition logic in one tested place.
- The reducer maps state and action to the next state.
- Context exposes the state and the dispatch function.
- Components dispatch actions instead of mutating directly.
Why the pair scales
As state grows complex with many related fields, scattered setters become hard to follow. A reducer names each transition as an action, so updates read like events. Context then delivers dispatch deep into the tree without threading callbacks through every level.
- Actions describe what happened, not how to mutate.
- Dispatch is stable, so passing it through context is cheap.
- Splitting state and dispatch contexts limits rerenders.
This pattern approximates a small state container without an external library.
Key idea
A reducer centralizes state transitions as actions, and context delivers the state and stable dispatch across a subtree without prop drilling.