npx skills add https://github.com/pproenca/dot-skills --skill zustand适用于 React 应用程序中 Zustand 状态管理的全面性能和架构指南。包含 8 个类别共 43 条规则,按影响优先级从关键(存储架构、选择器优化)到渐进式(高级模式)排序。
在以下情况下参考这些指南:
| 优先级 | 类别 | 影响 | 前缀 |
|---|---|---|---|
| 1 | 存储架构 | 关键 | store- |
| 2 | 选择器优化 | 关键 | select- |
| 3 | 防止重新渲染 | 高 |
广告位招租
在这里展示您的产品或服务
触达数万 AI 开发者,精准高效
render-| 4 | 状态更新 | 中高 | update- |
| 5 | 中间件配置 | 中 | mw- |
| 6 | SSR 与 Hydration | 中 | ssr- |
| 7 | TypeScript 模式 | 低中 | ts- |
| 8 | 高级模式 | 低 | adv- |
store-multiple-stores - 使用多个小型存储,而非单一大型存储store-separate-actions - 在专用命名空间中分离动作与状态store-event-naming - 将动作命名为事件而非设置器store-colocate-logic - 将动作与其修改的状态放在一起store-avoid-derived-state - 推导计算值而非存储它们store-domain-boundaries - 按功能域组织存储select-always-use - 始终使用选择器,切勿订阅整个存储select-atomic-picks - 对单个值使用原子选择器select-stable-returns - 确保选择器返回稳定的引用select-custom-hooks - 导出自定义钩子而非原始存储select-auto-generate - 对大型存储使用自动生成的选择器select-memoize-computed - 对开销大的计算选择器进行记忆化select-avoid-inline - 在组件外部定义选择器render-use-shallow - 对多属性选择使用 useShallowrender-equality-fn - 在需要时提供自定义相等性函数render-memo-children - 对受父存储更新影响的子组件进行记忆化render-subscribe-external - 对非 React 消费者使用 subscriberender-avoid-object-returns - 避免从选择器返回新对象render-split-components - 拆分组件以最小化订阅范围update-functional-set - 基于先前状态更新时使用函数形式update-immutable - 切勿直接修改状态update-shallow-merge - 理解 set() 的浅合并行为update-async-actions - 使用加载和错误状态处理异步动作update-batch-updates - 在单个 set 调用中批量处理相关更新mw-devtools-actions - 为 DevTools 调试命名动作mw-persist-partialize - 使用 partialize 进行选择性持久化mw-persist-migration - 对持久化状态进行版本管理和迁移mw-immer-nested - 对深度嵌套的状态更新使用 immermw-combine-order - 以正确的顺序应用中间件mw-slice-middleware - 在组合存储级别应用中间件ssr-skip-hydration - 在 SSR 上下文中使用 skipHydrationssr-manual-rehydrate - 在客户端挂载时手动重新水合ssr-hydration-hook - 使用自定义钩子防止水合不匹配ssr-check-window - 使用 typeof window 检查来防护浏览器 APIts-state-creator - 对切片类型使用 StateCreatorts-middleware-inference - 使用中间件时保持类型推断ts-separate-types - 分离状态和动作接口ts-generic-selectors - 为选择器添加类型以实现可重用性ts-bound-store - 正确地为组合存储添加类型adv-context-stores - 将 Zustand 与 React Context 结合以实现依赖注入adv-transient-updates - 使用 subscribe 进行瞬时更新adv-computed-getters - 使用 getter 实现计算状态adv-third-party-integration - 与 React Query 和 SWR 集成阅读各个参考文件以获取详细说明和代码示例:
| 文件 | 描述 |
|---|---|
| references/_sections.md | 类别定义和排序 |
| assets/templates/_template.md | 新规则模板 |
| metadata.json | 版本和参考信息 |
每周安装量
104
代码仓库
GitHub 星标数
86
首次出现
2026年1月29日
安全审计
安装于
opencode94
codex91
gemini-cli90
github-copilot87
cursor85
claude-code79
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).
Reference these guidelines when:
| 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- |
store-multiple-stores - Use multiple small stores instead of one monolithic storestore-separate-actions - Separate actions from state in dedicated namespacestore-event-naming - Name actions as events not settersstore-colocate-logic - Colocate actions with the state they modifystore-avoid-derived-state - Derive computed values instead of storing themselect-always-use - Always use selectors never subscribe to entire storeselect-atomic-picks - Use atomic selectors for single valuesselect-stable-returns - Ensure selectors return stable referencesselect-custom-hooks - Export custom hooks not raw storeselect-auto-generate - Use auto-generated selectors for large storesrender-use-shallow - Use useShallow for multi-property selectionsrender-equality-fn - Provide custom equality functions when neededrender-memo-children - Memo children affected by parent store updatesrender-subscribe-external - Use subscribe for non-React consumersrender-avoid-object-returns - Avoid returning new objects from selectorsupdate-functional-set - Use functional form when updating based on previous stateupdate-immutable - Never mutate state directlyupdate-shallow-merge - Understand set() shallow merge behaviorupdate-async-actions - Handle async actions with loading and error statesupdate-batch-updates - Batch related updates in single set callmw-devtools-actions - Name actions for DevTools debuggingmw-persist-partialize - Use partialize for selective persistencemw-persist-migration - Version and migrate persisted statemw-immer-nested - Use immer for deeply nested state updatesmw-combine-order - Apply middlewares in correct ordermw-slice-middleware - Apply middleware at combined store levelssr-skip-hydration - Use skipHydration in SSR contextsssr-manual-rehydrate - Manually rehydrate on client mountssr-hydration-hook - Use custom hook to prevent hydration mismatchssr-check-window - Guard browser APIs with typeof window checkts-state-creator - Use StateCreator for slice typingts-middleware-inference - Preserve type inference with middlewarets-separate-types - Separate state and actions interfacests-generic-selectors - Type selectors for reusabilityts-bound-store - Type combined stores correctlyadv-context-stores - Combine Zustand with React Context for dependency injectionadv-transient-updates - Use subscribe for transient updatesadv-computed-getters - Implement computed state with gettersadv-third-party-integration - Integrate with React Query and SWRRead individual reference files for detailed explanations and code examples:
| File | Description |
|---|---|
| references/_sections.md | Category definitions and ordering |
| assets/templates/_template.md | Template for new rules |
| metadata.json | Version and reference information |
Weekly Installs
104
Repository
GitHub Stars
86
First Seen
Jan 29, 2026
Security Audits
Gen Agent Trust HubPassSocketPassSnykPass
Installed on
opencode94
codex91
gemini-cli90
github-copilot87
cursor85
claude-code79
Tailwind CSS v4 + shadcn/ui 生产级技术栈配置指南与最佳实践
2,600 周安装
store-domain-boundariesselect-memoize-computedselect-avoid-inline - Define selectors outside componentsrender-split-components