Does this skill help with server-side caching?

Yes, it provides specific patterns for React Query and SWR to manage remote data, caching, and optimistic UI updates.

Is TypeScript supported in the examples?

All implementation patterns and code snippets provided are fully typed to ensure type safety across your React application.

Which state management library should I choose?

The skill suggests Zustand or Jotai for smaller apps with simple state, Redux Toolkit for large-scale enterprise applications with complex logic, and React Query for heavy server-state interaction.

Does it cover atomic state management?

Yes, the skill includes patterns for Jotai, which is ideal for granular, atomic state updates that prevent wide-scale component re-renders.

Can I use this to migrate from old Redux code?

Yes, the skill includes a dedicated migration guide to help you transition from legacy Redux boilerplate to modern Redux Toolkit (RTK).

React State Management Master

Name: React State Management Master
Author: lingxling

bylingxling

•

设计工具

Implements and optimizes modern React state management patterns using Redux Toolkit, Zustand, Jotai, and React Query.

This skill provides comprehensive guidance for architecting React applications by efficiently managing local, global, and server-side state. It helps developers choose the most appropriate tool for their project's specific complexity—ranging from lightweight atomic state with Jotai to scalable enterprise solutions with Redux Toolkit. By integrating best practices for optimistic updates, data normalization, and selective subscriptions, this skill ensures high-performance, maintainable React codebases with full TypeScript support and clear migration paths from legacy patterns.

主要功能

0146 GitHub stars

02State selection framework for choosing between atomic, slice-based, or server state

03Performance-optimized selector patterns to prevent unnecessary re-renders

04Multi-library implementation patterns (Zustand, Redux Toolkit, Jotai, React Query)

05Comprehensive TypeScript boilerplate for type-safe state transitions

06Advanced server-state synchronization including optimistic updates and cache invalidation

使用场景

01Migrating a legacy class-based Redux codebase to modern Redux Toolkit slices

02Implementing efficient server-side data fetching and synchronization with React Query

03Architecting the global state structure for a new complex React dashboard

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add lingxling/awesome-skills-cn react-state-management

For use in Claude.ai and ChatGPT

主要功能

0146 GitHub stars

02State selection framework for choosing between atomic, slice-based, or server state

03Performance-optimized selector patterns to prevent unnecessary re-renders

04Multi-library implementation patterns (Zustand, Redux Toolkit, Jotai, React Query)

05Comprehensive TypeScript boilerplate for type-safe state transitions

06Advanced server-state synchronization including optimistic updates and cache invalidation

使用场景

01Migrating a legacy class-based Redux codebase to modern Redux Toolkit slices

02Implementing efficient server-side data fetching and synchronization with React Query

03Architecting the global state structure for a new complex React dashboard

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add lingxling/awesome-skills-cn react-state-management

For use in Claude.ai and ChatGPT