diff算法中的概念

版权声明:欢迎交流讨论 https://blog.csdn.net/qq_37746973/article/details/82933323

合并多次setState

setState被设计为一个异步的方法,目的是为了提升React底层的性能。假设我们短时间内连续变更3次state,React就会把这3次setState合并为一次setState,只做一次VDOM的比对,提高了整体的性能。

同级比较

diff算法会从根节点开始,一层层的向下比较,如果在某一层的某个节点发现不同了,他就会直接替换这个节点下面的所有子树。

key值的重要性

如果每一个虚拟DOM节点没有一个key值,他就没有自己的一个名字。当我们在做新旧虚拟dom的比对时,旧状态的虚拟节点就与难以与新状态的虚拟节点之间确立关系。当每一个虚拟节点都有唯一key值时,新旧状态的虚拟节点很快就能知道谁是谁,这样就极大的提升了diff算法的效率。

为什么不要将数组的下标作为key值

假如数组中又3个节点a,b,c。我们使用数组下标来作为dom的key值。

[a, b, c] // 0:a, 1:b, 2:c

这时删除b

[a, c] // 0:a, 1:c

原来key值为1对应节点为b, 但现在key=1对应的节点变成了c。这时这个key值就失去了它存在的意义了。 所以,为key值绑定一个稳定的值才是正确的做法

猜你喜欢

转载自blog.csdn.net/qq_37746973/article/details/82933323