Yasin

Yasin

Redux和Zustand的区别

直接对比

Redux(RTK) Zustand
学习成本 较高(Action/Reducer/Slice 概念多) 极低(几乎没有模板代码)
代码量 较多 极少
包体积 较大 极小(~1kb)
调试工具 Redux DevTools 非常完善 支持 DevTools,但弱一些
异步处理 RTK Query / createAsyncThunk 直接在 action 里写 async
适合规模 中大型、团队协作 中小型项目

Zustand 写法有多简单

import { create } from "zustand";

const useCounterStore = create<{
  count: number;
  increment: () => void;
}>((set) => ({
  count: 0,
  increment: () => set((state) => ({ count: state.count + 1 })),
}));

// 组件里直接用
const { count, increment } = useCounterStore();

对比 Redux 需要 Slice + Store + Provider + useSelector + useDispatch,Zustand 简洁很多。


怎么选

  • 小中型项目、追求开发效率:选 Zustand
  • 大型项目、团队协作、需要严格数据流规范:选 Redux RTK
  • 已有 Redux 项目:没必要迁移