Comparison
External storevsReducer
External store
the value lives outside the component tree and components subscribe to just the slice they read.
State held outside the framework, with components subscribing to changes. It avoids re-rendering a whole subtree for a value only one leaf reads, and it survives being read outside React entirely. The costs are tearing during concurrent rendering if the store is not integrated properly, and the temptation to put everything in it, which turns local state into global state nobody can trace.
Full entry →Reducer
you replaced five interacting `setState` calls with one function that takes the current state and an action.
A pure function from current state and a described action to the next state. Centralising transitions makes impossible combinations easy to rule out and makes every change loggable and replayable, which is why debugging tools are built around it. It is overkill for one boolean, and it is the right call the moment two pieces of state must change together or a transition depends on the current state.
Full entry →