开发者学堂课程【React 入门与实战：介绍 Diff 算法的概念】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/585/detail/8076
介绍 Diff 算法的概念
目录：
一、Diff 算法 tree diff
二、Diff 算法 component diff
三、Diff 算法 element diff
diff 算法就是进行虚拟节点对比，并返回一个 patch 对象，用来存储两个节点不同的地方，最后用 patch 记录的消息去局部更新 Dom 。
目的：寻找差异
特点：
比较只会在同层级进行, 不会跨层级比较
在 diff 比较的过程中，循环从两边向中间比较。
一、tree diff
treediff :新旧两棵 DOM 树，逐层对比的过程，就是 Tree Diff ;当整颗 DOM 逐层对比完毕，则所有需要被按需更新的元素，必然能够找到
二、Component diff
component diff :在进行 TreeDiff 的时候，每一层中，组件级别的对比叫做 Component Dif f;
如果对比前后，组件的类型相同，则暂时认为此组件不需要被更新;
如果对比前后，组件类 型不同，则需要移除旧组件，创建新组件，并追加到页面上
React 是基于组件构建应用的，对于组件间的比较所采取的策略也是非常简洁、高效的。
如果是同一类型的组件，按照原策略继续比较 Virtual DOM 树即可如果不是，则将该组件判断为 dirty component，从而替换整个组件下的所有子节点
对于同一类型下的组件，有可能其 Virtual DOM 没有任何变化，如果能确切知道这一点，那么就可以节省大量的diff 算法时间。因此， React 允许用户通过shouldComponentUpdate()来判断该组件是否需要大量 diff 算法分析。
三、Element diff
element diff :在进行组件对比的时候，如果两个组件类型相同，则需要进行元素级别的对比，这叫做 Element Diff
当节点处于同一层级时，diff提供三种节点操作：
INSERT_MARKUP（插入）：如果新的组件类型不在旧集合里，即全新的节点，需要对新节点执行插入操作。
MOVE_EXISTING（移动）：旧集合中有新组件类型，且 element 是可更新的类型，generatorComponentChildren 已调用 receiveComponent，这种情况下 prevChild=nextChild，就需要做移动操作，可以复用以前的 DOM 节点。
REMOVE_NODE （删除）：旧组件类型，在新集合里也有，但对应的 elememt 不同则不能直接复用和更新，需要执行删除操作，或者旧组件不在新集合里的，也需要执行删除操作。
