React-Navigation 性能：多少屏幕太多了？

Question

我是 React Native 和 React-Navigation 的新手。我正在计划的应用程序内容非常丰富。 它将有数百个独特的屏幕。 我想通过 React-Navigation 连接它们，这样我的堆栈就会非常大。 该性能是否有问题或我应该记住什么？ 我的猜测是只有当用户第一次访问时才会加载屏幕，所以应用程序的初始加载时间应该不会受到影响？

谢谢！

Answer 1

实际上，创建 js 文件的数量并不重要，但在以下情况下很重要：

1. 不重用您的代码。 例如，您创建了一个使用 Card 的 3 Screens，因此它没有单独创建一个 card 组件 js 文件，那么复杂性会增加，但是如果您为 Card 创建一个 JS 文件并在 3 个屏幕中重复使用它，它会对此进行优化。 所以如果你这个组件将是可重用的，那么为它创建单独的文件。
2. 过度使用维度。 我知道在使用尺寸时，屏幕设计是响应式的，但在抽象级别上，它每次都会为每个屏幕计算高度和宽度，因此这不是一种优化方式。 所以尽量使用flex ，也尽量减少Dimension的使用。 但如果您明智地使用 Dimension，它是非常强大的工具。

3）FlatList、Map等图片展示时，尽量使用FastImage代替image

4. 您可以在此处获得更多信息： React-Native 中的优化

注意：最后我想说的是，你可以创建尽可能多的 JS 文件，但它必须是可重用的，不是不必要的，也没有重复的代码。

Answer 2

您也可以将此视为性能改进。

你有一个屏幕。 当您在其上按下或导航新屏幕时。 您可以停止背景屏幕中的动画。 因为后面的屏幕继续工作。 所以你可以停止动画背景屏幕。

例如，您在主屏幕和中有一个 slider 组件。 此 slider 自动播放功能处于活动状态。 当您更改主屏幕时，您可以停止自动播放功能。