开始使用
@shopify/react-native-performance-navigation
包是 react-native-performance 的配套包。
它包含一些我们预计大多数应用程序会觉得有用的附加高阶分析器,以及 ReactNavigationPerformanceView
,它构建在 vanilla PerformanceMeasureView
之上,并针对 React Navigation 库进行了优化。
此包有两个目标
- 提供应用程序可直接使用的实用程序,或
- 提供代码参考,展示如何基于
react-native-performance
提供的基础模块构建自定义分析器。- 如果您的应用程序使用的对等依赖项版本与此包声明的不同,您可以调整提供的实现以使其适用于您,直到您可以迁移。
请注意,还有其他辅助包可与 React Navigation 库一起使用
安装
您可以通过运行以下命令安装该软件包
bash
yarn add @shopify/react-native-performance-navigation
bash
yarn add @shopify/react-native-performance-navigation
请注意,此包具有以下应在您的应用程序 package.json 中列出的对等依赖项
bash
yarn add @react-navigation/core @react-navigation/stack @react-navigation/native @shopify/react-native-performance
bash
yarn add @react-navigation/core @react-navigation/stack @react-navigation/native @shopify/react-native-performance
ReactNavigationPerformanceView
如前所述,ReactNavigationPerformanceView
作为 PerformanceMeasureView
的替代品与 react-navigation
一起使用。它的 API 是相同的,但是,它有一个名为 transition-end
的新渲染过程,并影响何时将 interactive
设置为 true。每当屏幕 A 和屏幕 B 之间发生导航转换时,ReactNavigationPerformanceView
确保在转换成功完成之前,屏幕 B 不会被标记为 interactive
- 这是因为目标屏幕在转换期间本身不是交互式的。在转换结束后,您将看到另一个名称为 transition-end
的渲染过程事件。通过此事件,屏幕也可以被认为是 interactive
的(但它不必是,取决于您的用例)。