状态管理变迁史:为什么我们放弃了 Redux 选择 Zustand?

1. 状态管理在 Android 与 React Native 中的对应

在 Android 开发中,状态管理经历了从传统的 MVP (Presenter 保存状态) 到 MVVM (ViewModel + LiveData / StateFlow),再到如今配合 Compose 使用的单向数据流 (MVI)。

在 React Native 中,状态管理同样经历了一场演进。对于从 Compose 过来的开发者,最好将 RN 的状态管理类比为 Compose 中的 State 或者 ViewModel 里的 StateFlow

2. 传统霸主:Redux

Redux 是 React 生态中最老牌、最正统的状态管理库。

Redux 的核心概念

  • Store: 全局唯一的数据源 (类似全局单例的 ViewModel 存放所有 State)。
  • Action: 描述发生了什么 (类似 MVI 中的 Intent/Event)。
  • Reducer : 接收旧状态和 Action,返回新状态 (类似 MVI 中的 Reducer,通常是一个庞大的 whenswitch 语句)。

为什么我们觉得 Redux 太重了?

  • 样板代码极多 :为了改一个简单的布尔值,你需要写 Action Type、Action Creator、Reducer,然后绑定到组件上。这比写一个 MutableStateFlow 繁琐十倍。
  • 心智负担重:对于 Android 开发者来说,仅仅为了跨页面共享一个状态就要引入这么一套庞大的"单向数据流"哲学,显然是杀鸡用牛刀。

3. 轻量级新星:Zustand

Zustand(德语"状态")是目前 React 生态中最受欢迎的轻量级状态管理库之一。

Zustand 为什么更适合现代 RN 开发?

  1. 极简 API:不需要 Provider,不需要 Reducer,直接创建一个 hook 就可以用。
  2. 非常像 Kotlin 的单例 + StateFlow:在 Zustand 中,状态和修改状态的方法写在一起,非常直观。

示例对比

Android (Kotlin + StateFlow) :

kotlin 复制代码
object UserStore {
    private val _user = MutableStateFlow<User?>(null)
    val user = _user.asStateFlow()
​
    fun login(newUser: User) {
        _user.value = newUser
    }
}
// 在 Compose 中使用
val user by UserStore.user.collectAsState()

React Native (Zustand) :

javascript 复制代码
import { create } from 'zustand'
​
const useUserStore = create((set) => ({
  user: null,
  login: (newUser) => set({ user: newUser }),
}))
​
// 在组件中使用
const user = useUserStore((state) => state.user)
const login = useUserStore((state) => state.login)

可以看出,Zustand 的写法几乎和 Kotlin 中定义一个带状态的单例一样简单,但它能自动触发 React 组件的重新渲染,而不需要手动 collectAsState

4. 总结

对于 Android 开发者转型 RN,强烈建议直接跳过 Redux,使用 Zustand。它的心智模型更接近于我们在 Android 中习惯的基于 ViewModel 和 StateFlow 的状态共享,能够极大地提升开发效率。

相关推荐
子兮曰2 天前
jev-ultrafast 深度解析:7 秒订机票的浏览器 Agent 是如何炼成的
前端·后端·agent
子兮曰2 天前
Jev 爆发一周:7 秒 Agent 背后的 System One 生态与三场争议
前端·后端·ai编程
前端小万2 天前
写公众号赚了 3000 块后,我做了一款叫 "一键成稿" 的软件
前端·微信小程序
爱勇宝2 天前
ZCode 开源 24 小时:一份没有历史的账本,回答不了"有没有偷代码"
前端·后端·chatglm (智谱)
千里马学框架2 天前
一起学 Android 14:ShellTransition 屏幕旋转过程深度剖析
android·智能手机·性能优化·framework·性能·屏幕旋转·rotation
美狐美颜SDK开放平台2 天前
开发直播APP时如何接入视频美颜SDK?开发流程与注意事项
android·人工智能·计算机视觉·音视频·直播美颜sdk
三十而立洋2 天前
Cookie 详解:从产生到安全,一次讲透
前端·javascript
AFinalStone2 天前
Android7 SystemUI源码解析(七)Keyguard锁屏模块深度解析
android·systemui
卡布鲁2 天前
把一个 Vite + Vue3 应用塞进 qiankun (React + Umi3) 主站:十个坑的复盘
前端·javascript·react.js
致远ccc2 天前
Google Play 上架前如何测试 App?多国家 Android 环境测试
android·app测试·googleplay·多国家应用测试