简谈对虚拟Dom的理解

简单说一下我自己对虚拟DOM的理解。。。。

 

 

由于  jquery+es6模板字符串（渲染dom）=》真实的渲染  性能巨差

 

所以 为了提高性能虚拟DOM就是把真实的DOM转成JS 对象树 虚拟DOM创建以后（也就是componentWillMounted完成的时候 就创建了这个源树）根据组件内部的state 父组件的props 以及redux 的全局状态的更新 导致产生新的js对象树（就是目标树） 通过diff比较算法来比较两颗树的不同 把不同的节点在DOM树上渲染一下

diff算法是逐层比较 发现相同的就保留 发现删除的就删除 发现新增的就添加 这层比较把复杂度由O(n^3)降低到O（n^1）这个逐层比较会带来新的问题 1.如果这个变化比较复杂 2.兄弟节点需要排序插入的时候 这两种都是低效的  react产生两个假设 1.两个相同组件产生类似的DOM结构，不同的组件产生不同的DOM结构 2.对于同一层次的一组子节点 他们可以通过唯一的ID进行区分 事实上这两个假设成立1. 因为同一个组件的结构是稳定的 修改状态时只改变局部的内容 2.在用户开发时可以加一个id进行区分 所以diff算法是成功的 

转载于:https://www.cnblogs.com/zhangjixiang123/p/10013695.html