¿Cómo se diferencian las stores ligeras como Zustand y Jotai de Redux?

Question

Accepted Answer

**Zustand** y **Jotai** son librerías de estado mínimas que logran estado global con mucho menos boilerplate que Redux, y con **suscripciones selectivas** integradas para evitar re-renders innecesarios. Adoptan modelos mentales diferentes: Zustand es un único store; Jotai es atómico. ## Zustand — un store simple basado en hooks ```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 ; } ``` Sin provider, sin actions, sin reducers, sin dispatch — llamas funciones setter directamente. El selector (`s => s.count`) significa que el componente se re-renderiza *solo* cuando ese slice cambia. ## Jotai — estado atómico ```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 construye el estado desde pequeños **átomos** que compones; los componentes se suscriben a átomos individuales y se re-renderizan solo cuando esos átomos específicos cambian. ## Comparación con 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 ``` ## Cuándo elegir qué ```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 ``` ## Por qué es importante Zustand y Jotai representan la tendencia moderna de alejarse del boilerplate de Redux hacia un estado global **mínimo y ergonómico** con suscripciones selectivas integradas (resolviendo el problema de re-render de Context). Saber que existen — y que Zustand ofrece un modelo tiny single-store mientras que Jotai ofrece átomos componibles — te permite elegir una herramienta ligera que se adapte a las necesidades de estado global de la mayoría de aplicaciones, reservando Redux Toolkit más pesado para aplicaciones genuinamente grandes y complejas. La ventaja clave compartida sobre Context son las suscripciones granulares que previenen el sobre-renderizado.