Чем легковесные хранилища состояния, такие как Zustand и Jotai, отличаются от Redux?

Question

Accepted Answer

**Zustand** и **Jotai** — это минималистичные библиотеки состояния, которые обеспечивают глобальное состояние с гораздо меньшим количеством шаблонного кода, чем Redux, и со встроенными **избирательными подписками** для предотвращения ненужных перерисовок. Они используют разные ментальные модели: Zustand — это единственное хранилище; Jotai — атомарное состояние. ## Zustand — простое, основанное на хуках хранилище ```jsx import { create } from "zustand"; // define a store: state + the actions that update it, all in one place const useStore = create((set) => ({ count: 0, increment: () => set((s) => ({ count: s.count + 1 })), // no actions/reducers/dispatch reset: () => set({ count: 0 }), })); function Counter() { const count = useStore((s) => s.count); // SELECT — re-renders only when count changes const increment = useStore((s) => s.increment); return ; } ``` Нет провайдера, нет действий, нет редьюсеров, нет dispatch — вы вызываете функции-сеттеры напрямую. Селектор (`s => s.count`) означает, что компонент перерисовывается *только* при изменении этого среза. ## Jotai — атомарное состояние ```jsx import { atom, useAtom } from "jotai"; const countAtom = atom(0); // a tiny piece of state const doubleAtom = atom((get) => get(countAtom) * 2); // derived atom function Counter() { const [count, setCount] = useAtom(countAtom); // works like useState, but GLOBAL return ; } ``` Jotai строит состояние из малых **атомов**, которые вы компонуете; компоненты подписываются на отдельные атомы и перерисовываются только при изменении этих конкретных атомов. ## Сравнение с Redux ```text Redux (classic) Zustand Jotai Boilerplate high (actions/reducers) very low very low Provider required none minimal Mental model single store + dispatch single store, hooks atomic (useState-like) Re-renders needs selectors selector built-in per-atom (granular) Devtools excellent good good Bundle size larger tiny (~1KB) tiny ``` ## Когда выбрать что ```text Zustand → simple global state, minimal ceremony (most apps' global needs) Jotai → bottom-up/granular state, lots of independent pieces, derived values Redux(RTK) → very large apps, strict structure, rich devtools/middleware ecosystem ``` ## Почему это важно Zustand и Jotai представляют современный тренд отхода от шаблонного кода Redux в сторону **минималистичного, удобного** глобального состояния со встроенными избирательными подписками (решая проблему перерисовки Context). Понимание того, что они существуют — и что Zustand предлагает крошечную модель с единственным хранилищем, а Jotai предлагает компонуемые атомы — позволяет вам выбрать легковесный инструмент, подходящий для потребностей большинства приложений в глобальном состоянии, оставляя более тяжёлый Redux Toolkit для действительно крупных и сложных приложений. Ключевое общее преимущество перед Context — гранулярные подписки, которые предотвращают чрезмерную перерисовку.