反应性能：为什么不可变数据可以提高反应性能？

Question

我刚刚阅读了React官方Optimizing Performance指南。本文的一个优点是使用不可变数据以及如何使用它们。

但它并没有说明为什么不可变数据会影响性能。我想知道原因。

Answer 1

您提供的链接说明了：

  

不变性使跟踪变化变得便宜。总是会有变化   在一个新对象中所以我们只需要检查是否引用了   对象已经改变了。

不是检查对象的每个属性，而是检查那些属性的属性等，而只需要查看顶级引用是否已更改。

Answer 2

在 shouldComponentUpdate函数

中将先前状态与当前状态进行比较时，不变性起着作用

例如：

1. 我们有一些来自后端的航班数据
2. 进行一些操作后，您需要更新数据，并且需要更改价格。

以前的状态

航班= { 名称：“印度航空”， 价格：5000 }

来自后端的更新数据

价格更改为6000

有两种更改方法

1. 一个直接改变（变异）物体的物体

  

flight.price = 6000

1. 创建一个新副本并对该副本进行更改。

$ export NODE_ENV=production
$ node my-app.js

---

以上两种方法有什么区别？ 在深入研究之前，我们需要了解 ShouldComponentUpdate 的工作方式。

let modifyFlight = [...flight]; 
modifyFlight.price = 6000;
and set the state

在上面的函数中，该函数调用是否继续更新生命周期，它只会检查引用，而第一种方法引用中没有任何变化< / strong>，因此此函数返回false并停止更新生命周期，

但是，当我们创建一个新对象并进行所需的更改时，内存中的引用地址会更改并且与以前的对象地址不匹配，因此ShouldComponentUpdate将返回true和更新生命周期触发器。

最后一点，我们可以使用Immutability.js或任何其他js库来停止objets的突变，从而停止不必要的渲染。