如果你像我一样,之前一直停留在 React Native 0.72 时代,那么当你升级到 0.84 时,一定会感受到一种“恍如隔世”的震撼。
从 0.72 到现在(0.8x),可以说是 React Native 历史上变化最大、也是最激动人心的“黄金时代”。你跨越的这几个大版本,正好赶上了 RN 底层架构的彻底重写和社区生态的大洗牌。
现在的 React Native 已经不再是我们印象中那个“依赖 Bridge 传数据、容易卡顿、要写一堆恶心原生配置”的旧时代产物了。借着最近升级项目的契机,我盘点了一下目前(RN 0.84 时代)社区和核心框架到底发生了哪些天翻地覆的变化,带你快速跟上现在的技术栈。
一、 核心框架的剧变 (RN 0.73 ~ 0.76+)
从 0.76 开始,官方终于默认开启了新架构 (New Architecture),而在我当前的 0.84 项目中,新架构已经极其成熟和稳定。
1. 彻底告别 Bridge (Bridgeless 模式)
在 0.72 时代,JS 线程和原生线程(iOS/Android)通信必须通过一个叫 Bridge 的东西。它会把数据转换成 JSON 字符串,异步发送,这就导致了复杂的列表滑动或连续动画时经常出现卡顿、白屏。 现在的变化:全面切换到 JSI (JavaScript Interface)。JS 可以直接同步调用 C++ 的底层内存。渲染速度、启动速度、数据传递速度几乎和纯原生没有区别。
2. Fabric 渲染器
以前的渲染是异步的,JS 算完了 UI,丢给原生去画,中间有时间差。 现在的变化:Fabric 让 UI 渲染变成了同步的。这意味着你在处理复杂手势(比如拖拽卡片、双指缩放)时,再也不会出现“JS 算完了,但原生 UI 还没更新”的掉帧撕裂感。
3. React 19 与 React Compiler 的引入
现在的 RN 完全拥抱了最新的 React 19。最让人激动的是 React Compiler(React 编译器) 的引入。
以前为了性能,代码里到处都是 useMemo 和 useCallback,心智负担极重。现在社区开始大面积接入编译器,它会在打包时自动帮你做所有的 Memo 优化,代码又回到了最初的干净清爽。
4. 样式系统大升级 (Yoga 3.0)
以前 RN 的样式系统有很多反人类的地方,现在底层排版引擎 Yoga 升级到了 3.0+。
- 支持了真正的原生阴影
box-shadow(以前只能在 iOS 用 shadow,Android 只能用恶心的 elevation)。 - 支持了更多的 Web 标准 CSS 属性(比如
position: static、display: contents等),前端写起来更顺手。
二、 社区生态的“大一统”:Expo 统治天下
如果你之前写 0.72 还在用 npx react-native init(裸机 CLI),那么现在社区最大的共识是:新项目无脑选 Expo。注意,现在的 Expo 早就不是当年那个“不能写原生代码、打包体积巨大”的玩具了。它推出了两个革命性的功能,彻底统一了 RN 社区:
1. 连续原生生成 (CNG - Continuous Native Generation)
以前我们要手动去改 iOS 的 Podfile 或者 Android 的 build.gradle,很容易把项目改挂。
现在 Expo 引入了 Prebuild (预编译) / App Config 的概念。你只需要在 app.json 里写配置,每次跑项目时,Expo 会自动生成 ios 和 android 文件夹。这意味着你的原生环境永远是干净的、可复现的。
2. Expo Router (基于文件的路由)
以前大家都用 React Navigation 写一堆路由配置表。
现在大家都在用 Expo Router。它就像 Web 端的 Next.js 一样,你建一个 app/home.tsx 文件,它自动就成了一个路由页面。支持深度链接(Deep Link)、自动处理导航栏,开发体验极好。
三、 原生模块开发的降维打击
现在写原生模块再也不用去碰恶心的 Objective-C 或 Java 了,甚至不用手写 C++。目前社区有两大流派:
- Expo Modules API:用最现代的 Swift 和 Kotlin 编写,提供极其优雅的宏语法。
- Nitro Modules:追求极致性能和零延迟的跨平台通信。在我的 0.84 项目的
package.json中,就大量引入了基于 Nitro 的库。
四、 看看我项目的 package.json:2024-2026 现代 RN 项目的“标准技术栈”
翻开我现在的 package.json,很多 0.72 时代的老熟人都不见了,取而代之的是一群“性能怪物”。目前大家都在用的明星库包括:
1. ⚡️ 状态管理
- Zustand:全面取代 Redux。极简、无需 Provider 包裹、性能好。
- React Query (@tanstack/react-query):处理所有的网络请求状态、缓存、重试、分页机制,必备。
2. 🎨 UI 与样式
- NativeWind:RN 版的 Tailwind CSS。现在大家都不写
StyleSheet.create了,直接在组件上写className="flex-1 bg-red-500 rounded-lg",开发速度快到飞起。 - Tamagui / Gluestack:目前最火的两个高性能 UI 组件库,支持跨端(一套代码跑 Web、iOS、Android)。
3. 💾 存储革命:淘汰 AsyncStorage,拥抱 MMKV
"react-native-mmkv": "^4.1.2"
在 0.72 时,大家都在抱怨 AsyncStorage 存取大数据慢得要死。现在,基于 JSI 的 MMKV 是标配。它是由腾讯开源的底层技术,读写速度比 AsyncStorage 快了整整 30倍!同步存取,极其丝滑。
4. 🚀 通信革命:Nitro Modules 的崛起
"react-native-nitro-modules": "^0.33.9"
这是一个革命性的库。以前想写高性能的原生模块,必须手写复杂的 C++ JSI 胶水代码。现在有了 Nitro,你只需要写 TypeScript 接口,它会在底层自动帮你生成 C++ 代码,并且提供零延迟的 JS 与原生通信。
因为它的开发体验极佳且性能拉满,目前社区涌现了一大批基于 Nitro 重构的高性能第三方库(涵盖了数据库、蓝牙、图片压缩、Markdown渲染等方方面面)。
💡 延伸阅读:我专门整理了一篇关于目前最火的 Nitro 第三方库盘点,详情请看:👉 榨干 React Native 性能:盘点基于 Nitro Modules 重构的高性能第三方库
5. 🎬 动画与手势:Worklets 核心
"react-native-worklets-core": "^1.6.3"
- Reanimated 3 + react-native-gesture-handler:动画双子星,把动画计算全部放到 UI 线程(Worklet),彻底告别 JS 线程掉帧。
- Moti:基于 Reanimated 封装,让你像写普通样式一样写出复杂的弹性动画。
- 现在的变化:允许你把一小段 JS 代码直接丢到 UI 线程 或者独立的后台线程去跑,彻底解放了主线程的压力。
6. 🖼️ 摄像头、多媒体与图标
"react-native-vision-camera": "^4.7.3"
- lucide-react-native:目前最流行、最好看的矢量图标库(替代以前的 react-native-vector-icons)。
- expo-image 或 react-native-fast-image:解决原生图片加载慢、不缓存、闪烁的问题。
- Vision Camera:如果你还在用老掉牙的
react-native-camera,赶紧换吧!Vision Camera 是目前生态里最强、最现代的相机库,完美支持新架构、帧处理(Frame Processors)甚至直接跑 AI 模型识别!
7. 🗺️ 导航:React Navigation 7.x
"@react-navigation/native": "^7.1.28"
导航库也迎来了大版本更新。虽然现在 Expo Router 很火,但如果在裸机 (Bare RN) 中,React Navigation 7.x 依然是王者。它对新架构和原生屏幕切换 (react-native-screens) 做了深度优化,切换页面的手势和性能更加贴近原生。
结语:变与不变
从 0.72 升级到 0.84,这不仅仅是一个版本号的变化,而是 React Native 完成了从“一个跨平台框架”到“一个高性能跨平台框架”的蜕变。
当然,作为开发者,在日常的业务代码编写上,你可能不会有“改天换地”的割裂感。
- 什么没变? 你依然在写 React,依然在使用
View,Text,TouchableOpacity,依然是那个熟悉的组件化思想。业务逻辑的构建方式、Hooks 的使用习惯都没有变。 - 什么变了? 变的是底层引擎的轰鸣声,是你引入的那些第三方库的性能天花板,是曾经那些让你抓狂的“滑动白屏”、“动画掉帧”、“跨端通信延迟”被悄无声息地抹平了。
现在的 0.84 项目是一个站在巨人的肩膀上的版本。新架构 (Fabric/Bridgeless) + 现代状态管理 (Zustand/Query) + 高性能基建 (MMKV/Nitro/Reanimated) + 原子化 CSS (NativeWind) + React 19,这就是目前 React Native 的最终形态。
变的是性能的极限,不变的是 React 开发者丝滑的开发体验。