当我们有大数据时如何优化 Flatlist 的性能。
我的列表既有图像又有文字描述。
我想找到一种方法来提高列表的性能并删除从缓存列表中加载的额外图像以及让清单不重.
FlatList 组件应该是一个高性能的解决方案，用于在应用程序中显示大量数据列表。它仅根据当前可见的项目显示列表中的某些项目。
也就是说，有一些技巧可以帮助使其更快/更轻
- 如果您的平面列表项具有相同的高度（假设垂直滚动平面列表），这会有所帮助。在这种情况下，您可以使用 getItemLayout 属性来设置 FlatList 的高度并跳过动态计算https://facebook.github.io/react-native/docs/flatlist#getitemlayout https://facebook.github.io/react-native/docs/flatlist#getitemlayout
- 您可能想尝试使用removeClippedSubviews prop来看看它是否有帮助https://facebook.github.io/react-native/docs/flatlist#removeclippedsubviews https://facebook.github.io/react-native/docs/flatlist#removeclippedsubviews
- 不要一次加载所有数据，而是在 fetch 调用中使用某种形式的分页（如果可能）。然后，您可以使用 onEndReached 等获取更多数据。
- 确保您的 FlatList 仅在应该更新时更新。我通常在包含 FlatList 的组件中使用 shouldComponentUpdate 以确保它仅在其数据更改时更新，而不是在我不关心的其他状态/ prop 变量更改时更新
- 如果您的 FlatList 项目包含图像，您应该考虑缓存它们
我确信您还可以做更多事情，但这就是我的:)
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
