React - 使用深度相等而不重新渲染对象标识更改

Question

React讨论this page about performance你可以使用浅等式并避免变异对象，这样组件只需要检查引用以查看props或状态是否发生变化。

我实际上想知道相反的情况：是否有可能让相等检查使用深度相等并在对象引用发生变化时忽略（只要它们的内容不会发生变化）？

原因是，我有一个库，它返回一些内部变量的克隆版本，为了查看这些变量的更新，我需要重新询问内部变量，从而得到一个全新的克隆。因此，我将通过引用获得完全不同的对象，但它们可能没有更改任何字段。但是每当我请求这样的更新时，React认为一切都已经改变，因为所有引用都发生了变化，并且它重新呈现了许多不必要的东西。

当前的解决方案：将其放在一个组件中，只要对象＆＃39; 字段无法更改

shouldComponentUpdate(nextProps, nextState) {
  return !_.isEqual(this.props, nextProps) || !_.isEqual(this.state, nextState);
}

由于lodash的isEqual等级检查很深，但是我必须对每个想要这种行为的组件执行此操作。我想知道是否有

• 实现此目标的首选方式
• 我使用的反模式首先导致了这一点，我可以完全避免它

或者上述方法最好。

Answer 1

由于以下原因，我不建议你这样做：

1. 深度比较成本很高。因此，每当某些事情发生变化时，您都必须进行深度比较，然后再进行渲染部分。我们最好让反应进行渲染，因为它是为它做的。

2. 关于在所有组件中处理它的情况。我们可以通过解构对象从而发送较小的道具来避免这个问题，现在反应可以处理优化的重新渲染。例如：

   <Footer data={object} />

   <Footer title={object.title} copyright={object.copyright}/>

我希望有所帮助！