skills.rest
moughamir
moughamirCOMMUNITY
Explore all skills by this author →
Website𝕏@omnizyaGitHub

zustand

Review Zustand stores for selector scoping, update patterns, and middleware ordering.

Updated Mar 26, 2026
Search Tags:#middleware#zustand#ssr hydration#re-render prevention#react state management#selector optimization#persist migration
One-click install
npx skills add https://github.com/moughamir/justwaitit-review --skill zustand-moughamir
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: zustand
Source: https://github.com/moughamir/justwaitit-review/tree/main/.agents/skills/zustand
Command: npx skills add https://github.com/moughamir/justwaitit-review --skill zustand-moughamir

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps you avoid common Zustand performance and correctness pitfalls that cause unnecessary React re-renders, broken state synchronization, and hard-to-maintain store APIs.

Core Features & Use Cases

  • Store architecture guidance: structure stores around feature domains, split monolith stores into small ones, and keep actions colocated with the state they mutate.
  • Selector and render performance rules: always use selectors, prefer atomic selectors, stabilize return references (or use shallow strategies), and memoize expensive derived computations.
  • Correct middleware and SSR/hydration practices: apply devtools/persist/immer in the right order, use persist version migration patterns, and guard or defer browser-only logic in SSR/Next.js.

Quick Start

Use the zustand Skill to review or refactor a React/Zustand store by applying the rule set to selector usage, action naming, update patterns, and SSR/hydration safety.

Frequently Asked Questions about zustand

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I prevent unnecessary re-renders in my Zustand store?▼

Prevent Zustand re-render waste by prescribing atomic selectors, stabilizing return references, and applying shallow compare strategies to ensure components only update when targeted state slices change.

What is the correct middleware ordering for Zustand devtools, persist, and immer?▼

Apply Zustand devtools, persist, and immer middleware in the correct sequential order to maintain state synchronization and ensure debugging, storage, and immutability features function together without breaking store updates.

How do I handle SSR hydration and browser-only logic in Next.js with Zustand?▼

Guard or defer browser-only logic during SSR hydration in Next.js Zustand stores to ensure server-rendered state matches client state, preventing hydration mismatches and broken synchronization.

How do I migrate persisted state when my Zustand store structure changes?▼

Implement Zustand persist version migration patterns to safely transform existing stored data when store structures change, ensuring persisted state schema updates without losing user data.

What's the best way to structure large Zustand stores?▼

Structure large Zustand stores by splitting monoliths into small feature-domain stores and colocating actions with the state they mutate, resulting in a maintainable store API.

Why does my Zustand selector return new references and cause infinite loops?▼

Zustand selectors cause infinite loops by returning new object or array instances on every call; stabilize return references or apply shallow compare strategies to prevent this performance issue.

Related Skills

Explore More Software Engineering Skills→
MinhDuyDEVMinhDuyDEV

zustand

Implement Zustand v5 stores with slices, middleware, and SSR-aware patterns.

Community
Intermediate
inpinitiinpiniti

zustand

Connects a Zustand vanilla store to the json-render StateStore interface.

Community
Intermediate
gajjalaashok75-UIgajjalaashok75-UI
2

react-best-practices

Identify and correct React and Next.js performance issues in code reviews.

Community
Advanced
fgarofalo56fgarofalo56
6

state-management

Guide React state management with Zustand, Redux Toolkit, Jotai, and React Query.

Community
Advanced