Vue 虚拟Dom 和 Diff算法原理

虚拟DOM:

虚拟 DOM 的最终目标是将虚拟节点渲染到视图上但是如果直接使用虚拟节点覆盖旧节点的话,会有很多不必要的 DOM操作:比如有一个ul标签 然后里面有很多的li 其中的一个li需要变化 就用新的ul去替换旧的ul 这样会造成性能上的浪费

Diff算法:

用 JS 对象结构表示 DOM 树的结构;然后用这个树构造一个真正的 DOM 树,插到文档中状态改变的时候,重新构造一个新的对象树。然后用新的树和旧的树做比较,记录两棵树差异 把记录的差异应用到正真的DOM树上 然后更新页面

猜你喜欢

转载自blog.csdn.net/weixin_46071217/article/details/108673846