17611538698
info@21cto.com

React 编译器完成 Rust 移植,AI 辅助大规模代码迁移,编译速度最高提升 10 倍

编程语言 0 15 8小时前
图片

导读:近日,React 框架团队将React Complier更换到了Rust内核。

React 核心团队近日在 GitHub 合并了关注度极高的 PR。

该团队正式把原本基于 TypeScript 实现的 React 编译器(Compiler) 完整移植到了 Rust 之上

本次移植是由核心成员 josephsavona 主导,成为一场极具行业参考意义的实践 —— 整体架构由人类统筹设计,代码由 AI 辅助生成,人工负责方向把控、方案审核与质量收口,给大型开源项目重构提供了全新之范式。

为何要把 React 编译器迁移到 Rust


React 编译器是 React 生态举足轻重的编译优化工具,能够自动分析组件依赖、消除不必要重渲染,无需再手动书写 useMemouseCallback,自动完成组件运行时性能优化,成为未来 React 性能体系的基石。

React 原先的编译器整体基于 TypeScript 开发,虽然可读性强、生态适配便捷,但受 JS 语言本身运行效率、垃圾回收机制限制,在大型项目、海量文件批量编译场景存在明显性能瓶颈。而 Rust 与生俱来的无 GC 高性能、内存安全、零成本抽象特性,恰好可以针对性解决这类问题。

本次迁移的核心目标总结如下:

  • 大幅降低编译耗时,提升大型前端工程构建速度;
  • 摆脱 JS 运行时性能桎梏,适配 SWC、OXC 等 Rust 系下一代编译工具链;
  • 沉淀底层高性能公共库,为后续更多场景深度集成打好底层基础。

人类定架构,AI 批量落地编码


本次移植最特别的亮点,并非单纯技术选型的切换,而是成熟落地了人主导架构 + AI 大规模编码的协作模式。

整个项目顶层设计、分层架构、增量迁移方案、完整测试策略全部由开发者手动敲定,明确整体迁移路线、边界约束与质量标准;具体的类型转换、逻辑复刻、逐行翻译、重复模板代码,则交给 AI 批量生成。

开发者亦并非放任 AI 自由编写,而是投入大量精力做代码审核、逻辑对齐、漏洞修正、重构打磨,反复校验输出质量,最终让整套 Rust 代码达到生产级可用标准,为大型开源项目重构、老旧代码迁移提供了可复用的新思路。

统一中间层设计,兼容 Babel、SWC、OXC 多编译体系


新版 Rust React 编译器对外采用统一接口规范:Rust Babel AST 入参、Babel AST 结果输出,使用 Babel AST 作为跨工具中间交换格式。

  • Babel、OXC、SWC 等不同编译工具,只需要在自身语法树结构与统一 Babel AST 之间做一次转换适配,即可接入编译器能力;
  • 当前集成方案仍需要外部传入作用域相关信息,长期规划中,React Compiler 会内置绑定、引用自动计算逻辑,不再依赖外部数据注入。

在内部编译流程上,Rust 版和原版 TypeScript 架构完全同源:编译器将外层 AST 统一转化为自研高层中间表示 HIR,依托控制流图(CFG)+ 静态单赋值(SSA)结构开展多轮编译遍历优化,每一轮处理逻辑、算法策略和原版一一对应,属于严格逐 Pass 对等移植。

二者唯一核心差异集中在数据存储模型上。为适配 Rust 所有权与借用检查规则,项目大范围采用 arena 内存池分配结构 + 索引引用模式,规避频繁内存分配、所有权转移带来的额外开销,贴合 Rust 的最佳实践。

性能数据亮眼:整体提速 3 倍,核心转换逻辑最高提速 10 倍


现阶段基准测试仍在持续完善,但测试结果已具参考价值:

  • 在 Babel 插件接入模式下,Rust 版本整体编译速度约为 TS 原版的 3 倍
  • 扣除序列化、格式转换开销后,编译器内部核心转换逻辑运行效率提升接近 10 倍
  • 如果直接原生集成进 SWC、OXC 体系,省去 AST 来回转译损耗,理论性能涨幅还会进一步扩大。
  • 正确性验证也已全面过关:全部 1725 组测试用例快照比对全部通过。Rust 版本编译产出代码、报错提示信息和 TypeScript 原版完全一致;每一轮编译 Pass 处理后的内部 HIR 中间结构也基本等同,仅存在少量 ID 规范化带来的微小差异。同时面向 OXC、SWC 的示例集成工程均可正常运行,兼容性得到验证。


三层测试体系,全方位保障移植正确性


为确保移植过程没有逻辑偏差,团队配套三套自动化校验脚本,层层兜底:

  • yarn snap --rust:核心主力测试套件,批量比对 Rust 版与 TS 版输出快照,保证编译结果一致性;
  • test-e2e.sh:端到端全量校验,分别验证 Babel 封装模式、OXC 原生集成、SWC 原生集成三种接入形态是否正常工作;
  • test-rust-port.sh:深度内部校验脚本,逐轮比对每一个编译 Pass 执行后的内部中间状态,从底层杜绝逻辑移植错位。

后续生态合作模式规划


目前,React 团队正式对外开放合作意向,邀约 OXC、SWC 等主流 Rust 编译器团队深度联动,预设标准化集成方案:

  1. SWC、OXC 等项目仓库仅承担轻量化适配封装、Lint 流水线对接工作;
  2. React Compiler 核心逻辑封装为独立 Crate(react_compiler_swcreact_compiler_oxc)托管在 React 官方仓库;
  3. 后续算法迭代、BUG 修复、功能升级统一在官方仓库完成,各集成方无需同步修改核心代码,维护成本更低。

当前待优化事项


目前移植工作并未彻底收尾,该团队梳理出明确迭代路线如下:

  1. 函数返回类型优化:当前返回 Option,后续改为增量补丁式返回结构,更适配增量编译场景;
  2. AST 结构精细化优化:借助 arena 内存分配 + smol_str 精简字符串开销,进一步压缩内存占用;
  3. 内置作用域解析:自研绑定与引用分析逻辑,彻底摆脱对外部序列化作用域数据的依赖,实现自闭环编译。

结语


本次 React 编译器从 TypeScript 大规模迁移至 Rust,并非是一次简单的语言重构,更是前端编译赛道的标志性事件:一方面借助 Rust 补齐编译性能短板,深度绑定 SWC、OXC 下一代编译生态;另一方面验证了「人类定架构 + AI 批量编码」在大型开源项目重构中的可行性。

随着后续版本逐步稳定落地,React 大型项目构建速度、运行时自动优化能力,都将迎来一轮明显升级。

作者:场长

参考:https://github.com/react/react/pull/36173

评论

我要赞赏作者

请扫描二维码,使用微信支付哦。

分享到微信