Zustand

React 🟡 Mid

Définition

Librairie de state management minimaliste sans boilerplate. Un store = une fonction, pas de Provider requis, compatible avec le rendu concurrent.

Analogie

Comme un carnet de notes partage au bureau : tout le monde y accède directement, sans passer par un secrétaire (Provider).

Exemple de code

const useStore = create((set) => ({
  count: 0,
  increment: () => set((s) => ({ count: s.count + 1 })),
}));

function Counter() {
  const count = useStore((s) => s.count);
  return <span>{count}</span>;
}

Cas d'usage

État global simple a moyen sans la complexité de Redux, idéal pour les projets de toute taille.

Anti-pattern

Ne pas utiliser de sélecteurs, souscrivant a tout le store et causant des re-rendus inutiles.
#state#interview#ecosystem

En entretien

  1. Quelle différence entre Zustand et Redux Toolkit ?

    Zustand est une librairie minimaliste sans boilerplate où un store est une simple fonction, sans Provider requis, contrairement à Redux Toolkit qui structure davantage avec des slices et un store centralisé. C'est comme un carnet de notes partagé au bureau où tout le monde accède directement, sans passer par un secrétaire (Provider).

  2. Quel est le piège classique avec Zustand ?

    Ne pas utiliser de sélecteurs et souscrire à tout le store, ce qui cause des re-rendus inutiles. On utilise plutôt useStore((s) => s.count) pour ne s'abonner qu'à la valeur nécessaire.

Fiche mise à jour le 2026-09-27

← → au clavier pour passer d'une fiche à l'autre