Facebook 正在重构 React Native,将重写大量底层


发布者 ourjs  发布时间 1529126866774
关键字 技术前沿  分享 

Facebook 五年前为 React Native 框架设计的原则,负面影响了与 JavaScript 代码的整合程度,也加大了某些特性的开发难度。因此 Facebook 现在准备对 React Native 架构进行重构,通过引入更先进的架构,来提高 JavaScript 和混合开发中原生 API 的互通性。


昨日,React 工程经理 Sophie Alpert 在其官方博客上宣布 Facebook 将要重构 React Native,使其更轻量,更具灵活性,更适应 JavaScript 生态圈的发展。

在博客中 Sophie Alpert 表示,React Native 项目的设计初衷是成为 JavaScript 和原生应用之间的桥梁。React DOM 将 React 的状态更新变成了命令式、可变的 DOM API 调用,如 document.createElement(attrs) 和 .appendChild(),而 React Native 则返回一个单独的 JSON 消息,它列出了要执行的一些操作,如 [["createView", attrs], ["manageChildren", ...]]

他们将整个系统设计为永不依赖获取同步响应,并确保该列表中所有的内容都可以完全序列化为 JSON,并且可以反序列化回来。这样做是为了提升灵活性:在这个架构之上,能够构建诸如 Chrome 调试器之类的工具,这些工具可以通过 WebSocket 连接异步运行所有的 JavaScript 代码。

但在过去的 5 年里,他们发现最初的设计原则加大了某些特性的开发难度。异步桥接(asynchronous bridge)意味着不能直接将 JavaScript 逻辑与很多原生 API 集成在一起,因为这些原生 API 是同步的。

批量桥接(本地调用队列)意味着 React Native 应用程序调用原生实现的函数会更加困难。而且串行化的桥接意味着不必要的复制,因为它不是直接在两个世界之间共享内存。对于完全使用 React Native 构建的应用程序,这些限制通常是可承受的。但对于在 React Native 与现有应用程序代码之间进行复杂集成的应用程序,情况则变得十分糟糕。

因此,Facebook 正在对 React Native 进行大规模重构,让架构变得更加灵活,并更好地与混合 JavaScript/原生应用开发中的原生基础设施集成。

通过这个项目,他们将应用在过去 5 年中学到的知识,逐步让架构更现代化。他们正在对 React Native 内部进行大量的重写,当然大部分工作都是在底层进行的,所以现有的 React Native 应用程序几乎不需要做出更改。

为了使 React Native 更轻量化并能更好地适应现有的原生应用,此次重构主要从三个方面进行:

  • 首先,改变线程模型。UI 更新不再需要在三个不同的线程上执行,而是可以在任意线程上同步调用 JavaScript 进行优先更新,同时将低优先级工作推出主线程,以便保持对 UI 的响应

  • 其次,将异步渲染功能引入 React Native 中,允许执行多个渲染并简化异步数据处理

  • 最后,简化桥接,让它更快、更轻量。原生和 JavaScript 之间的直接调用效率更高,并且可以更轻松地构建调试工具,如跨语言堆栈跟踪

完成以上工作之后,有可能带来更紧密的集成。现在,不通过复杂的 hack 手段就无法让原生导航和手势处理或原生组件(如 UICollectionView 和 RecyclerView)一起工作。但在对线程模型做出更改之后,开发者构建这样的功能将会非常简单。

Sophie Alpert 最后说到,他们的目标是希望 React Native 在 JavaScript 端能够更加轻量,以更好地适应 JavaScript 生态系统。等今年晚些时候这个项目将要完工时,Facebook 会披露更多的细节,敬请期待。

博客原文:https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018