Zustand Patterns

Quick Guide: Zustand owns state two or more components read; useState owns state one component reads; the URL owns filters and search; Context injects singletons and holds no state. Zustand v5 changes three things: useShallow from zustand/react/shallow replaces the old equality-function second argument, selectors must return stable references or they loop, and persist no longer captures initial state at creation.

Detailed Resources:

• examples/core.md — store setup, atomic selectors, useShallow, the Context anti-pattern, URL state
• reference.md — middleware lookup, v5 migration notes, peer-dependency requirements

<critical_requirements>

Before writing Zustand code

Move a value into a store as soon as a second component reads it. Passing it down instead couples every component on the path, and relocating it later means unpicking that chain.

Select one value per useStore call. The component then re-renders when that value changes and at no other time; a call with no selector subscribes to the whole store.