React 中最吸引开发人员的就是虚拟 DOM和高效的 Diff 算法，优化了因为多次刷新页面带来的性能问题，开发人员也无需频繁操作DOM，从性能角度来说有很大的提升。
-
什么是虚拟 DOM Diff 算法？
在react中render执行的结果并不是真正的DOM节点，而是虚拟DOM，当页面发生变化时，需要通过Diff算法对比变化前后的虚拟DOM，从而更新视图。
虚拟DOM Diff算法逐层进行节点对比，且仅对比同级节点；同一层次的一组子节点通过唯一Id进行区分；两个相同组件差生类似的DOM结构，不同的组件产生不同的DOM结构。
-
虚拟 DOM Diff 算法分析
-
不同类型节点
对比同一父节点下的所有子节点时，发现节点不存在，直接删除该节点，该节点下的子节点也会被删除；发现又增加的新节点，会创建并添加新节点至相应位置。
例：如下图所示，我们需要作出这样的转换
转换过程如下：
D will unmount D is created C is updated A is updated D did mount B is updated R is updated-
相同类型节点
-
类型相同，属性不同，直接重设属性
-
列表节点的比较
如下图所示，我们需要作出这样的转换
没有设置唯一的key值，转换过程如下：
C will unmount D will unmount D is created C is created D did mount C did mount A is updated R is updated已设置唯一的key值，转换过程如下：
D is updated C is updated A is updated R is updated
-
-
