Open-Source-Projekt
pmndrs/zustand avatar
pmndrs/zustand

Zustand: ein providerfreier State-Hook für React

Tragen Sie Notwendigkeiten für die Zustandsverwaltung in React bei. Wenn Sie ein einzelnes Objekt mit mehreren Statusauswahlen darin erstellen möchten, ähnlich wie bei reduxs MapStateToProps, können Sie useShallow verwenden, um unnötige erneute Renderings zu verhindern, wenn sich die Selektorausgabe nicht entsprechend Shallow Equal ändert.

58.679 Sterne2.187 ForksTypeScriptMIT

Auf einen Blick

Was ist das?
Eine kleine, schnelle und skalierbare State-Management-Bibliothek für React mit Hooks-API und ohne erforderliche Provider.
Für wen ist es gedacht?
Zustand bietet eine minimale, auf Hooks basierende API für React-State mit Selektoren, Middleware und einem Vanilla-Kern, aber das README quantifiziert seine Leistungsaussagen nicht und enthält keine Benchmark-Daten. Für zustand eignet sich diese Einordnung als Ausgangspunkt, wenn die im README genannten Funktionen genügen; ungeklärte Plattform-, Versions- und Leistungsfragen müssen an pmndrs/zustand und den konkreten Projektdateien geprüft werden.
Darf ich es kommerziell nutzen?
Ja. MIT ist eine freizügige Lizenz: Sie dürfen darauf aufbauende Software nutzen, verändern und verkaufen, solange Sie die Urheberrechts- und Lizenzhinweise beibehalten.
Wird es noch gepflegt?
Ja. Die letzten Commits kamen vor 5 Tagen.
In welcher Sprache ist es geschrieben?
Hauptsächlich TypeScript, laut der Sprachstatistik von GitHub.

Die Antworten beruhen auf den GitHub-Daten des Projekts (zuletzt abgeglichen am 14. September 2026) und auf unserer Analyse. Sie sind keine Rechtsberatung.

TIEFGEHENDE OPEN-SOURCE-ANALYSE

Eine schlanke State-Lösung mit Hooks

Zustand beschreibt sich selbst als eine kleine, schnelle und skalierbare, schlanke State-Management-Lösung, die vereinfachte Flux-Prinzipien verwendet. Das README sagt, dass die API auf Hooks basiert, nicht boilerplate-lastig oder meinungsstark ist, und dass Zeit für häufige Fallstricke wie das Zombie-Child-Problem, React-Konkurrenz und Kontextverlust zwischen gemischten Renderern aufgewendet wurde. Der Installationsbefehl lautet `npm install zustand`, und das README verweist auf eine Live-Demo und Dokumentation. Das Repository ist in TypeScript geschrieben und unter pmndrs gehostet, mit der Beschreibung „Bear necessities for state management in React".

Bei zustand ist Punkt 1 nur im Rahmen der README-Angaben belastbar. Die Dokumentation nennt dazu konkrete Projektbegriffe und verweist auf die jeweils genannten Dateien, Befehle oder Schnittstellen. Nicht beschriebene Varianten, Grenzfälle und Messwerte lassen sich aus dem Material nicht ableiten. Für die Einordnung ist deshalb wichtig, die genannte Funktion mit dem tatsächlichen Quelltext und der dokumentierten Version von pmndrs/zustand abzugleichen.

Die praktische Bedeutung von Abschnitt 1 hängt vom vorgesehenen Einsatz ab. Wer zustand in eine bestehende Umgebung einordnet, sollte die im README erwähnten Abhängigkeiten, Optionen und Ausgabeformen getrennt betrachten. So bleibt erkennbar, welche Aussage direkt dokumentiert ist und wo die Unterlagen offen bleiben.

Einen Store erstellen und Komponenten binden

Die Kern-API ist `create`, eine Funktion, die eine Funktion erhält, die `set` und optional `get` bekommt und den Anfangszustand zurückgibt. Das README-Beispiel definiert einen Store mit `bears`, `increasePopulation` und `removeAllBears`, wobei `set` den Zustand standardmäßig zusammenführt. Der resultierende Store ist ein Hook, der ohne Provider verwendet werden kann. Um eine Komponente zu binden, rufst du den Hook mit einem Selektor auf, und die Komponente rendert nur dann neu, wenn sich der ausgewählte Wert ändert. Das README warnt davor, dass das Abrufen des gesamten Zustands mit `useBearStore()` die Komponente bei jeder Zustandsänderung aktualisiert. Für mehrere Auswahlen verhindert `useShallow` unnötige Neurenderungen, wenn die Selektorausgabe oberflächlich gleich ist.

Bei zustand ist Punkt 2 nur im Rahmen der README-Angaben belastbar. Die Dokumentation nennt dazu konkrete Projektbegriffe und verweist auf die jeweils genannten Dateien, Befehle oder Schnittstellen. Nicht beschriebene Varianten, Grenzfälle und Messwerte lassen sich aus dem Material nicht ableiten. Für die Einordnung ist deshalb wichtig, die genannte Funktion mit dem tatsächlichen Quelltext und der dokumentierten Version von pmndrs/zustand abzugleichen.

Die praktische Bedeutung von Abschnitt 2 hängt vom vorgesehenen Einsatz ab. Wer zustand in eine bestehende Umgebung einordnet, sollte die im README erwähnten Abhängigkeiten, Optionen und Ausgabeformen getrennt betrachten. So bleibt erkennbar, welche Aussage direkt dokumentiert ist und wo die Unterlagen offen bleiben.

Zustandszugriff außerhalb von Komponenten und transiente Updates

Für nicht-reaktiven Zugriff stellt der Store-Hook `getState`, `setState` und `subscribe` bereit. Das README zeigt, wie man frischen Zustand liest, auf alle Änderungen hört und sich abmeldet. Die Middleware `subscribeWithSelector` fügt eine Selektor-Signatur mit Optionen wie `equalityFn` und `fireImmediately` hinzu. Transiente Updates werden durch Abonnieren in `useEffect` und Ändern einer Ref behandelt, was Neurenderungen vermeidet. Zustand kann auch ohne React laufen: `createStore` aus `zustand/vanilla` gibt `getState`, `setState`, `subscribe` und `getInitialState` zurück, und der `useStore`-Hook bindet einen Vanilla-Store an React. Das README weist darauf hin, dass Middleware, die `set` oder `get` modifiziert, nicht auf `getState` und `setState` angewendet wird.

Bei zustand ist Punkt 3 nur im Rahmen der README-Angaben belastbar. Die Dokumentation nennt dazu konkrete Projektbegriffe und verweist auf die jeweils genannten Dateien, Befehle oder Schnittstellen. Nicht beschriebene Varianten, Grenzfälle und Messwerte lassen sich aus dem Material nicht ableiten. Für die Einordnung ist deshalb wichtig, die genannte Funktion mit dem tatsächlichen Quelltext und der dokumentierten Version von pmndrs/zustand abzugleichen.

Die praktische Bedeutung von Abschnitt 3 hängt vom vorgesehenen Einsatz ab. Wer zustand in eine bestehende Umgebung einordnet, sollte die im README erwähnten Abhängigkeiten, Optionen und Ausgabeformen getrennt betrachten. So bleibt erkennbar, welche Aussage direkt dokumentiert ist und wo die Unterlagen offen bleiben.

Middleware für Persistenz, Unveränderlichkeit und Redux-Tools

Das README dokumentiert mehrere Middleware. `persist` speichert Store-Daten in einem beliebigen Speicher, mit `createJSONStorage` und einem eindeutigen Namen; standardmäßig wird `localStorage` verwendet. Die `immer`-Middleware erlaubt es, den Zustand in `set`-Callbacks zu mutieren. Die `redux`-Middleware verdrahtet einen Reducer und fügt eine `dispatch`-Funktion hinzu. Die `devtools`-Middleware integriert sich in die Redux-DevTools-Erweiterung, unterstützt das Benennen von Stores, Serialisierungsoptionen, das Protokollieren benutzerdefinierter Aktionstypen und das Deaktivieren in der Produktion mit `enabled: false`. Es zeigt auch, wie eine einzelne DevTools-Verbindung über mehrere Stores geteilt wird.

Bei zustand ist Punkt 4 nur im Rahmen der README-Angaben belastbar. Die Dokumentation nennt dazu konkrete Projektbegriffe und verweist auf die jeweils genannten Dateien, Befehle oder Schnittstellen. Nicht beschriebene Varianten, Grenzfälle und Messwerte lassen sich aus dem Material nicht ableiten. Für die Einordnung ist deshalb wichtig, die genannte Funktion mit dem tatsächlichen Quelltext und der dokumentierten Version von pmndrs/zustand abzugleichen.

Die praktische Bedeutung von Abschnitt 4 hängt vom vorgesehenen Einsatz ab. Wer zustand in eine bestehende Umgebung einordnet, sollte die im README erwähnten Abhängigkeiten, Optionen und Ausgabeformen getrennt betrachten. So bleibt erkennbar, welche Aussage direkt dokumentiert ist und wo die Unterlagen offen bleiben.

React-Kontext, TypeScript und Best Practices

Für Abhängigkeitsinjektion oder die Initialisierung eines Stores aus Komponenten-Props empfiehlt das README die Verwendung eines Vanilla-Stores mit React-Kontext: `createStore` für den Store, dann `useStore` in einer Komponente. Die TypeScript-Nutzung erfordert `create<State>()(...)`; ein detaillierterer Leitfaden ist verlinkt. Der Best-Practices-Abschnitt verlinkt auf Anleitungen zum Aufteilen von Stores in Slices, flux-inspirierte Praxis, Testen und den Umgang mit Aktionen außerhalb von Event-Handlern in pre-React 18. Drittanbieter-Bibliotheken sind in einem eigenen Dokument aufgeführt.

Bei zustand ist Punkt 5 nur im Rahmen der README-Angaben belastbar. Die Dokumentation nennt dazu konkrete Projektbegriffe und verweist auf die jeweils genannten Dateien, Befehle oder Schnittstellen. Nicht beschriebene Varianten, Grenzfälle und Messwerte lassen sich aus dem Material nicht ableiten. Für die Einordnung ist deshalb wichtig, die genannte Funktion mit dem tatsächlichen Quelltext und der dokumentierten Version von pmndrs/zustand abzugleichen.

Die praktische Bedeutung von Abschnitt 5 hängt vom vorgesehenen Einsatz ab. Wer zustand in eine bestehende Umgebung einordnet, sollte die im README erwähnten Abhängigkeiten, Optionen und Ausgabeformen getrennt betrachten. So bleibt erkennbar, welche Aussage direkt dokumentiert ist und wo die Unterlagen offen bleiben.

Vergleiche und Lizenz

Das README vergleicht zustand mit redux und context. Gegenüber redux hebt es Einfachheit, Hooks als primäre Konsumationsmethode, keine Kontext-Provider und transiente Updates hervor. Gegenüber context nennt es weniger Boilerplate, Rendern nur bei Änderungen und zentralisierten, aktionsbasierten Zustand. Ein vollständiger Vergleich ist verlinkt. Das Projekt ist unter MIT lizenziert, was die Erlaubnis zur Nutzung, Kopie, Änderung, Zusammenführung, Veröffentlichung, Verteilung, Unterlizenzierung und zum Verkauf von Kopien gewährt, aber die Lizenz bietet keine Garantie. Das README enthält keine Benchmark-Zahlen oder Sicherheitsgarantien, daher bleiben diese Leistungs- und Sicherheitsaussagen unquantifiziert.

Bei zustand ist Punkt 6 nur im Rahmen der README-Angaben belastbar. Die Dokumentation nennt dazu konkrete Projektbegriffe und verweist auf die jeweils genannten Dateien, Befehle oder Schnittstellen. Nicht beschriebene Varianten, Grenzfälle und Messwerte lassen sich aus dem Material nicht ableiten. Für die Einordnung ist deshalb wichtig, die genannte Funktion mit dem tatsächlichen Quelltext und der dokumentierten Version von pmndrs/zustand abzugleichen.

Die praktische Bedeutung von Abschnitt 6 hängt vom vorgesehenen Einsatz ab. Wer zustand in eine bestehende Umgebung einordnet, sollte die im README erwähnten Abhängigkeiten, Optionen und Ausgabeformen getrennt betrachten. So bleibt erkennbar, welche Aussage direkt dokumentiert ist und wo die Unterlagen offen bleiben.

Redaktionelles Fazit

Zustand bietet eine minimale, auf Hooks basierende API für React-State mit Selektoren, Middleware und einem Vanilla-Kern, aber das README quantifiziert seine Leistungsaussagen nicht und enthält keine Benchmark-Daten. Für zustand eignet sich diese Einordnung als Ausgangspunkt, wenn die im README genannten Funktionen genügen; ungeklärte Plattform-, Versions- und Leistungsfragen müssen an pmndrs/zustand und den konkreten Projektdateien geprüft werden.

Offizielle Quellen

  1. Official documentation
  2. Official README
  3. Project repository
  4. Release notes
Community-Notizen

Community-Notizen