配了三年 React,每次编译都要等——今天 Oxc 把 React Compiler 彻底接进了自己的 AST 里

React 团队把 React Compiler 移植到 Rust 之后,整个 Rust 工具链都想把它接进去。但接进去容易,接得好很难。

React Compiler 需要跑在某种 AST 上面。一开始,React 团队自己的 Rust Port 维护了一套 Babel 形状的 AST,所有想集成它的工具都得先把自家 AST 转成那一套、转回来。一来一回,多了 5 MiB 的体积,编译还变慢了。

Oxc 的做法是把 React Compiler 直接 vendoring 进来,让它跑在自己的 AST 上,不经过 Babel AST 这一层转换。效果:

  • 比 React 官方 Rust Port 快 2 倍
  • oxc-transform-react 二进制 3.97 MiB,之前 fork 方案是 8.66 MiB
  • 原来 100 ms 的编译文件现在 10 ms
  • 诊断信息重新做了,输出更适合 AI agent 理解

现在你只需要装两个包,就能把 React Compiler 直接跑在 Oxc 的工具链上:

pnpm add -D oxc-transform-react
import { transformSync } from "oxc-transform-react";

const result = transformSync("Component.tsx", sourceCode, {
  reactCompiler: { target: "19" },
  jsx: { runtime: "automatic" }
});

或者直接用 Vite 8,装 @vitejs/plugin-react v6.1.0,配一行 compiler: true 就能用。

这件事有意思的地方在于:React Compiler 原本是一个 Babel 插件,现在它跑在了 Oxc 的 AST 上,同时 Oxlint 还多了 22 条 React Compiler 驱动的规则。这些规则直接复用编译器内部的校验逻辑,比原来 ESLint 规则更准。

换句话说:你装一个 Oxc,语法检查、格式化、React 规则校验、编译优化,四件事一个二进制全干了,之间没有重复解析、没有 AST 转换。

下一步:如果你已经在用 Vite 8,装一下 @vitejs/plugin-react@^6.1.0,看看你现有组件有多少可以自动被编译器优化掉。

评论区

0 条评论

登录后可评论。

铁锈·Rust工具链 16 阅读