React:diff算法(简介)

React:diff算法(简介)

即：比较两棵新旧DOM树差别的算法(different算法),比较得出两棵DOM树的差异后，对有差异的部分进行页面更新，这样则可以不必更新大块的DOM元素，大大减少性能开销。

• tree diff: 新旧两棵DOM树,逐层对比的过程;当整棵DOM树逐层对比完毕,则所有需要被按需更新的元素,必然能够找到;
• component diff: 在进行Tree diff的时候,每一层中,组件级别的对比,叫做component Diff;
  • 如果对比前后,组件的类型相同,则暂时认为此组件不需要被更新;
  • 如果对比前后,组件类型不同,则需要移除旧组件,创建新组件,并追加到页面上;
• element diff: 在进行组件对比的时候，如果两个组件类型相同,则需要进行元素级别的对比,这叫做element diff;