虚拟DOM，DOM diff ，Vue.nextTick()
虚拟DOM是什么
- 一个能代表 dom 树的对象，通常含有
标签名、标签上的属性、事件监听和子元素们以及其他属性
虚拟DOM优点
- 减少DOM操作
1.虚拟DOM可以将多次操作合并为一次操作，比如添加1000个节点，不用虚拟DOM会操作1000次
2.虚拟DOM借助DOM diff可以吧多余的操作省掉，比如添加1000个节点，只有10个是新增的
- 跨平台
虚拟DOM缺点
- 需要额外的创建函数，如 createElement 和 h，但可以通过 JSX 来简化为 XML 写法
创建虚拟Dom
- Vue：通过h函数创建。Vue template语法，通过 vue-loader 转换为 h 形式
- React：通过 babel 转换为 createElement 形式
什么是DOM diff
- 就是一个函数，我们称之为 patch
- 递归对比前后dom树的区别
- patches = patch(oldVNode,newVNode)
- patches 就是要运行的 dom 操作（增删改之类的dom操作）
- 先不做，把要更新的dom操作 放到一个任务队列里，等全部统计结束了一次性更新
- 这也是vue中有时需要使用
$nextTick 的原因
本文标题：虚拟DOM，DOM diff ，Vue.nextTick()
本文链接：https://www.haomeiwen.com/subject/qrngdltx.html
网友评论