real diff算法是怎么运作的，从tree层到component层到element层分别讲解

real diff算法是react在虚拟dom层进行性能优化的一部分，他通过比较两个虚拟dom树的差异更新必要的部分，减少dom操作和提升渲染效率

1）tree层：

首先进行的是tree层的比较，在这一层，react会遍历整个组件树的虚拟dom，对每个节点进行比较，如果两个节点的类型不同，则替换掉几点及其子节点。如果节点类型相同且具有唯一的key属性，react会尽可能的复用自己已经存在的节点

2）Component层：

如果tree层比较重发现某个组件的实例已改变，react会调用该组件的componentWillReceiveProps生命周期，并进行进一步的比较，在此过程中，组件可以根据新的属性和状态进行自定义的比较和处理，如果组件需要更新，则触发shouldComponentUpdate生命周期函数来判断是否需要进行下一步的比较

3）Element层：

在先来年各个层次的比较完成后，react接下来会比较真实dom元素的属性和内容，根据前两个层次的比较结果react知道那些元素需要被更新删除或者添加