Skip to main content

为何采用新架构


提醒

本文档仍为 experimental，详细信息可能会随着我们的迭代而发生变化。 欢迎在此页面分享你对 工作组内部讨论 的反馈。

英This documentation is still experimental and details are subject to changes as we iterate. Feel free to share your feedback on the discussion inside the working group for this page.

而且，它还包含几个 手动步骤。 请注意，一旦新架构稳定，这将不代表最终的开发者体验。 我们正在开发工具、模板和库，以帮助你快速开始使用新架构，而无需完成整个设置。

英Moreover, it contains several manual steps. Please note that this won't be representative of the final developer experience once the New Architecture is stable. We're working on tools, templates and libraries to help you get started fast on the New Architecture, without having to go through the whole setup.

新架构的目标是解决旧架构在性能和灵活性方面存在的一些问题。 本节提供了理解旧架构的局限性以及如何使用新架构克服这些局限性的基本背景。

英The goal of the New Architecture is to solve some of the issues that afflicted the Old Architecture in terms of performance and flexibility. This section provides the basic context to understand the Old Architecture's limitations and how it has been possible to overcome them with the New Architecture.

这不是技术深入探讨： 有关更多技术信息，请参阅网站的 架构 选项卡。

英This is not a technical deep dive: for further technical information, refer to the Architecture tab of the website.

旧架构的问题​

旧架构过去的工作方式是使用名为 The Bridge 的组件序列化必须从 JS 层传递到原生层的所有数据。 可以将桥想象为生产者层向消费者层发送一些数据的总线。 消费者可以读取数据、反序列化数据并执行所需的操作。

英The Old Architecture used to work by serializing all the data that had to be passed from the JS layer to the native layer using a component called The Bridge. The Bridge can be imagined as a bus where the producer layer sends some data for the consumer layer. The consumer could read the data, deserialize it and execute the required operations.

该桥有一些固有的局限性：

英The Bridge had some intrinsic limitations:

  • 它是异步的： 一层将数据提交给桥，并异步 "waited" 供另一层处理它们，即使这并不是真正必要的。
  • 它是单线程的： JS 过去是在单线程上工作的； 因此，那个世界中发生的计算必须在该单个线程上执行。
  • 它增加了额外的管理费用： 每当一层必须使用另一层时，它就必须序列化一些数据。 另一层必须对它们进行反序列化。 选择的格式是 JSON，因为它简单且易于阅读，但尽管它是轻量级的，但这是要付出代价的。

新架构的改进​

新架构放弃了桥的概念，转而采用另一种通信机制： JavaScript 接口 (JSI)。 JSI 是一个接口，允许 JavaScript 对象保存对 C++ 的引用，反之亦然。

英The New Architecture dropped the concept of The Bridge in favor of another communication mechanism: the JavaScript Interface (JSI). The JSI is an interface that allows a JavaScript object to hold a reference to a C++ and vice-versa.

一旦一个对象引用了另一个对象，它就可以直接调用另一个对象的方法。 例如，C++ 对象现在可以要求 JavaScript 对象执行 JavaScript 世界中的方法，反之亦然。

英Once an object has a reference to the other one, it can directly invoke methods on it. So, for example, a C++ object can now ask a JavaScript object to execute a method in the JavaScript world and viceversa.

这个想法带来了几个好处：

英This idea allowed the unlocking of several benefits:

  • 同步执行： 现在可以同步执行那些原本不应该异步的函数。
  • 并发： JavaScript 可以调用在不同线程上执行的函数。
  • 降低开销： 新架构不再需要序列化/反序列化数据； 因此无需支付序列化税。
  • 代码共享： 通过引入 C++，现在可以抽象所有与平台无关的代码并在平台之间轻松共享。
  • 类型安全： 为了确保 JS 能够正确调用 C++ 对象的方法，反之亦然，添加了一层自动生成的代码。 代码是从某些必须通过 Flow 或 TypeScript 输入的 JS 规范开始生成的。

这些优势是 新的原生模块系统 的基础，也是进一步增强的跳板。 例如，可以开发提供更快、性能更高的 原生组件 的 新渲染器。

英These advantages are the foundations of the New Native Module System and a jumping stone to further enhancements. For example, it has been possible to develop a new renderer which offers faster and more performant Native Components.

进一步阅读​

有关新架构的技术概述，请阅读 架构选项卡。

英For a technical overview of the New Architecture, read the Architecture tab.

有关 Fabric 渲染器的更多信息，请阅读 Fabric 部分。

英For more information on the Fabric Renderer, read the Fabric section.