Zustand

This is a comprehensive ruleset for writing performant Zustand stores in React, covering 43 rules across 8 categories from store architecture to advanced patterns. Use it when creating new stores, optimizing selector performance, or reviewing state management code. The critical stuff is selector optimization (always use selectors, never subscribe to the entire store) and architecture decisions like splitting into multiple small stores instead of one monolith. The rules are well organized by impact level, so you can focus on what actually prevents re-renders before worrying about TypeScript niceties. Good reference when you're fighting unnecessary re-renders or trying to figure out the right way to structure persistence and SSR hydration.

skills.sh installs: 453
GitHub stars: 222
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add pproenca/dot-skills --skill zustand --agent claude-code

Installs into .claude/skills of the current project.

Files

Community Zustand Best Practices

Comprehensive performance and architecture guide for Zustand state management in React applications. Contains 43 rules across 8 categories, prioritized by impact from critical (store architecture, selector optimization) to incremental (advanced patterns).

When to Apply

Reference these guidelines when:

Creating new Zustand stores
Optimizing re-render performance with selectors
Implementing persistence or middleware
Integrating Zustand with SSR/Next.js
Reviewing code for state management patterns

Rule Categories by Priority

Priority	Category	Impact	Prefix
1	Store Architecture	CRITICAL	`store-`
2	Selector Optimization	CRITICAL	`select-`
3	Re-render Prevention	HIGH	`render-`
4	State Updates	MEDIUM-HIGH	`update-`
5	Middleware Configuration	MEDIUM	`mw-`
6	SSR and Hydration	MEDIUM	`ssr-`
7	TypeScript Patterns	LOW-MEDIUM	`ts-`
8	Advanced Patterns	LOW	`adv-`