配了三年 React，每次给组件加 memo 都要和 useCallback 搏斗——今天这件事被 Rust 重写的 React Compiler 彻底原生化了

React 项目里有个经典场景：组件越写越多，每次 review 都要追着问「这个要不要 useCallback」「那个 useMemo 依赖对不对」。三年下来，memo 相关代码堆成山，依赖数组漏一个就在生产环境埋一颗雷。

这件事，2026 年被彻底翻了一次。

Meta 把 React Compiler 从 TypeScript 重写成了 Rust，合并进了 React 主仓库。紧接着，Oxc 团队把它 vendoring 进了自己的 AST，二进制体积从 8.66 MiB 砍到 3.97 MiB，诊断信息对 coding agent 更友好，source map 缝隙也补上了。结果是：oxc-transform-react 比 babel-plugin-react-compiler 快 12-16 倍。

12-16 倍是什么概念

在 Oxc 官方 benchmark 里，一个普通的 TSX 文件（UserSettings.tsx），babel-plugin-react-compiler 平均耗时 13.39ms，oxc-transform-react 只要 0.87ms。更大的 table.tsx 组件，98.68ms 降到 8.02ms，12.3 倍。

这个性能提升来自一个架构决策：之前 Rust 版本的 React Compiler 是在 Babel AST 上面封了一层，需要一次 JSON 往返和 AST 转换。Oxc 直接把 Rust 编译器 vendoring 进了自己的 AST，跳过了这层转换。这才有了 2x 的额外加速。

Vite 8 现在一句话开启

@vitejs/plugin-react v6.1.0 已经支持这个集成。只要装好依赖，在 config 里加一个选项：

// vite.config.ts
import react, { reactCompilerPreset } from @vitejs/plugin-react
import babel from @rolldown/plugin-babel

export default defineConfig({
  plugins: [
    react(),
    babel({ presets: [reactCompilerPreset()] }),
  ],
})

Vite 8 本身也在 2026 年 3 月 12 日发布了正式版，统一用 Rolldown 替代了之前的 esbuild（dev）+ Rollup（prod）双 bundler 架构。Linear 的生产构建从 46 秒掉到 6 秒，87% 的缩减。Mercedes-Benz.io 也有 38% 的改善。Rolldown 1.0 在 5 月 7 日达到稳定。

这意味着整个链路都 Rust 化了：Oxc 解析 → Rolldown 打包 → oxc-transform-react 做 React Compiler 优化。三个环节各自比 JavaScript 前代快 10-50 倍，串在一起就是质的飞跃。

不只是一次重写，是生态的位移

React Compiler 的本质是静态分析：在编译时扫你的组件代码，找出哪些值和函数可以被 memoized，直接把 useMemo / useCallback 给你插进去，正确性由编译器保证，你不用再维护那些依赖数组。

之前这个能力只有 TypeScript 版本，Babel 插件跑起来在大项目里是明显的性能瓶颈。现在 Rust 版本直接集成进构建链路，配上 Oxc 的 844 条 lint 规则（其中 22 条是 React Compiler powered），整个工具链从「发现 memo 问题」到「自动修复」到「构建优化」全链路闭环。

下一步

如果你现在还在用 Vite 7，先升级到 Vite 8。然后装 @vitejs/plugin-react@^6.1.0 和 oxc-transform-react，改一行 config，production build 就会自动跑 React Compiler 的自动 memoization。原来那些 useMemo/useCallback 不用急着删，编译器会保留它们，先跑一段时间看 DevTools 里的 Memo 标签覆盖了哪些组件，再逐步清理冗余代码。

这是一次前端构建链路的范式转移——从「各工具独立工作各自解析」，到「共享 AST 的统一工具链」。三年前你在依赖数组上踩的坑，现在一行配置就能绕过去。