帮助迁移 React Native 库到新架构
tl; dr:我们正在努力改进支持 React Native 新架构的资源。我们已经发布了一个仓库来帮助迁移您的应用 (RNNewArchitectureApp) 和一个用于您的库的仓库 (RNNewArchitectureLibraries)。我们还在改进网站上的 新架构指南,并创建了一个 GitHub 工作组来回答有关新架构的问题。
简介
在这篇文章中,我们将分享关于工具和资源的更新,以帮助您将 原生模块 和 原生组件 迁移到它们 新架构 的等效项,即 TurboModule 和 Fabric 组件。
React Native 用户利用大量的开源库来构建应用。为了一个完整和一致的生态系统,这些库必须进行迁移,以便每个人都可以从新架构解锁的功能和性能改进中受益。
以下是我们正在努力支持库开发者迁移到新架构的工作
- 文档: 我们正在扩展网站上的 新架构指南,以涵盖更多新架构的概念以及如何开发您的组件。
- 示例迁移: 我们设置了两个仓库来演示如何将 React Native 应用迁移到新架构 (RNNewArchitectureApp) 以及如何创建与新旧架构都兼容的 Fabric 组件 和 TurboModule (RNNewArchitectureLibraries)。
- 支持: 今年早些时候,我们创建了一个 GitHub 工作组,专门讨论和解答有关新架构的问题。
在这篇文章中,我们将深入探讨这些资源,并更详细地解释您如何最有效地使用它们。最后,我们将提供当前最常用的 React Native 库的迁移状态快照。
文档
在过去的 6 个月中,我们添加了一个 关于采用新架构的指南 和一个关于 Fabric 的 架构深入探讨。我们计划扩展它,以包括更多关于创建 TurboModule、理解 CodeGen 等的指南和文档。我们计划在 0.70 版本发布之前分享更新。
目前,新架构 指南涵盖了如何 迁移您的应用 和 您的库 以正确支持新架构。
如果您对本指南的演变感兴趣,或有反馈意见,您可以关注 此 pull request。
示例迁移
对于可能希望跟随代码的开发者,我们准备了两个示例仓库。
RNNewArchitectureApp
这个仓库 创建的目的是演示如何将应用、原生模块和原生组件从 React Native 0.67 版本的旧架构迁移到新架构和最新版本的 React Native。每个提交都对应一个独立的迁移步骤。

该仓库的组织结构如下
- main 分支没有代码,但有一个 README.md 文件,其中宣传了其他分支。
- 几个迁移分支,展示了从特定版本的 RN 到另一个版本的迁移。
一些迁移分支还包含一个 RUN.md 文件,该文件以更易于理解的方式描述了每个提交中应用的精确步骤。
我们计划使此示例与最新的稳定版本保持同步,为我们将要发布的 React Native 的任何小版本添加迁移。如果您发现任何步骤有问题,请在仓库中提交 issue。这将持续到我们合理地认为大多数 React Native 用户已迁移到新架构为止。
RNNewArchitectureLibraries
同样,这个仓库 提供了关于如何创建 TurboModule 和 Fabric 组件 的逐步指南。它侧重于确保新架构和旧架构之间的向后兼容性。
该仓库的组织方式与前一个类似
- main 分支没有代码,但有一个 README.md 文件,其中宣传了其他分支。
- 其他分支展示了如何开发 TurboModules 和 Fabric 组件。
我们计划使此示例保持更新到新的 React Native 版本,尤其是影响库开发的版本,并添加更多关于如何使用高级功能的示例(例如:实现命令、事件发射器、自定义状态)。如果您发现错误,请在示例仓库中提交 issue。
支持
我们创建了一个专门的 工作组,为社区提供空间来提问并获取关于新架构的更新。如果您是库维护者,这是一个宝贵的资源,可以找到您问题的答案,并让我们了解您的需求。要加入,请按照 这些说明 进行操作。欢迎所有人。
工作组分为几个部分
- 公告:用于分享关于 RN 新架构推广的里程碑和重大更新的地方
- 深入探讨:用于讨论深入探讨和技术特定主题的地方
- 文档:用于讨论新架构文档和迁移材料的地方
- 库:用于讨论第三方库及其迁移到新架构的故事的地方
- 问答:用于向社区寻求关于新架构主题帮助的地方
- 发布:用于讨论特定版本的错误和构建问题的地方
为了有效地使用这个工作组
- 确保您的库已列在 库 部分中。这将帮助我们分享关于您的库迁移状态的更新,并将帮助我们了解库作者在支持您方面面临哪些困难。
- 如果您遇到阻碍并且需要支持,请利用问答 部分。我们的团队和社区专家正在监控并将尽最大努力提供支持。
- 关注其他部分,了解可能影响您的主题。新的版本可能正好引入了您一直在寻找的 API。您可以通过 GitHub 订阅特定的讨论。
我们计划支持这个工作组,直到 新架构 默认启用,并且所有主要的库都已迁移到它。
热门库的迁移状态
库维护者一直在 工作组 中与我们分享他们的迁移工作状态,我们想为您提供一个快速概览
- react-native-gesture-handler:✅ 已迁移
- react-native-navigation:🏃♂️ 进行中
- react-native-pager-view:🏃♂️ 进行中
- react-native-reanimated:✅ 已迁移。正在进行性能测试和分析
- react-native-screens:🏃♂️ 进行中
- react-native-slider:🎬 已开始
- react-native-template-new-architecture:✅ 已迁移。逐步采用/测试更多配套库
- react-native-template-typescript:✅ 已迁移
- react-native-webview:🎬 已开始
下一步
我们致力于支持 React Native 社区采用新架构。具体来说,我们将继续
- 在 工作组 中提供尽力而为的支持。
- 在 RNNewArchitecture 仓库中提供更多关于如何使用新架构取得惊人成果的示例。
- 提供关于 新架构 的清晰和最新的文档。
- 在 工作组 中跟踪重要 React Native 库的迁移状态。
- 简化开发者的迁移路径
此外,React Native 0.69 将为应用和库开发者提供改进的 devX,以采用新架构。您可以在 此处 找到关于 0.69.0 版本的更多信息。
我们对我们将与 新架构 一起构建的内容感到兴奋!