缓慢时如何在本机反应中加快联系人处理速度？答案

【问题标题】：How to speed up contacts handling in react native when slow?缓慢时如何在本机反应中加快联系人处理速度？
【发布时间】：2020-04-15 13:52:51
【问题描述】：

我一直致力于构建一个模块，以允许用户邀请他们的朋友使用应用程序。代码可以正常工作，但由于我的手机中有 100 多个联系人，因此速度相当慢。滚动不是问题，我可以在手机拉取数据时添加一个加载器。但是当我选择一个元素进行突出显示时，需要几秒钟才能检查该项目。我很好奇是否有人对如何优化有任何提示？

我的零食在下面：

主文件：inviteScreenTwo.js

【问题讨论】：

【解决方案1】：

只要你改变你的状态，React 就会更新屏幕上的元素。在您的情况下，我怀疑延迟是由于 React 会在您更改突出显示时检查您显示的所有联系人记录并更新它们。

解决此问题的一种方法是确保屏幕外的联系人实际上不在 DOM 中。您需要更新您的 render 方法以仅将联系人记录放置在实际可见的列表中。这样一来，React 就不需要更新那么多元素了。请参阅React docs 了解有关此优化的更多信息。

另一种方法是为您的记录组件覆盖生命周期方法shouldComponentUpdate，确保仅在其突出显示的状态更改时重新呈现。这称为和解避免。该方法具有以下签名：

shouldComponentUpdate(nextProps, nextState) {
}

默认情况下，此方法总是返回true。您可以更改它以将nextProps 与this.props 进行比较，检查突出显示是否已更改，并根据需要返回true 或false。在React docs 中阅读有关此优化的更多信息。

【讨论】：