Decision Framework
| Need | Solution |
|---|---|
| Component-only UI state | useState / useReducer |
| Shared state, few consumers | Lift state up |
| Deep tree, moderate sharing | Context |
| Complex global state | Zustand / Redux / Jotai |
| Server state | TanStack Query / SWR |
Context Pitfalls
// Every consumer re-renders when ANY context value changes
const ThemeContext = createContext();
// Fix: split contexts or memoize values
const value = useMemo(() => ({ theme, toggle }), [theme]);
Interview Questions
Q: When is Redux overkill?
Small apps, mostly server-fetched data, or simple UI state. Prefer React Query + local state.
Q: useReducer vs useState?
useReducer for complex state transitions, multiple sub-values, or when next state depends on previous.
Q: How does Zustand differ from Redux?
Minimal boilerplate, no providers required, direct store access, built-in selectors. Redux offers stronger devtools and middleware ecosystem.