react-native 渲染引擎经历了什么

Jacky（易小天）

已于 2024-05-16 13:50:45 修改

阅读量1k

点赞数 31

文章标签： react native react.js javascript

于 2024-05-14 16:57:26 首次发布

本文链接：https://blog.csdn.net/qq_35374791/article/details/138861523

版权

React Native 的渲染引擎经历了多个迭代，不断优化和改进。以下是一些较为显著的迭代：

原生组件封装：最初的 React Native 版本是通过 JavaScript 渲染 UI，并通过桥接层将 UI 转化为原生组件。随着发展，React Native 开始封装更多的原生组件，提高了性能和体验。
FlatList 和 SectionList 的引入：为了更高效地渲染列表和长列表，React Native 引入了 FlatList 和 SectionList 组件，它们采用了虚拟化技术，只渲染当前可见区域的列表项，大幅提升了性能。
增量更新：React Native 不断优化了增量更新机制，通过比较新旧 Virtual DOM 树的差异，只对有变化的部分进行更新，减少了不必要的 DOM 操作，提高了性能。
TurboModules：TurboModules 是 React Native 的一项新特性，旨在加速 JavaScript 与原生模块之间的通信。它替代了旧版的 Native Modules，提供更高效的模块通信机制，进一步提升了性能和稳定性。
Fabric 架构：React Native 团队开发了名为 Fabric 的新渲染引擎，旨在提高渲染性能和可靠性。Fabric 架构将 React Native 应用的 UI 渲染和布局分离，采用异步渲染和多线程架构，从而更好地利用了多核处理器和异步计算能力。
Hermes 引擎：为了提升 JavaScript 执行性能和应用启动速度，React Native 引入了 Hermes JavaScript 引擎。Hermes 是一个轻量级的 JavaScript 引擎，专注于优化移动设备上的 JavaScript 执行性能，从而提升了 React Native 应用的性能和响应速度。