虚拟DOM
虚拟DOM是什么
一个能代表DOM树的对象，通常含有标签名、标签上的属性、事件监听和子元素们，以及其他元素
为什么虚拟DOM比真实DOM快
- 减少DOM操作
- 虚拟DOM可以多次操作合并为一次操作，如你添加1000个节点，却是一个接一个操作的。
- 虚拟DOM借助DOM diff可以把多余的操作省掉，如你添加1000个节点，实际上只有十个是新增的。
- 跨平台 虚拟DOM不仅可以变成DOM，还可以变成小程序，IOS应用，安卓应用，因为虚拟DOM本质上是一个JS对象。
虚拟DOM的优缺点
优点
虚拟DOM比真实DOM快的两点
缺点
需要额外的创建函数，如createElement或h，但可以通过JSX来简化成XMl写法（严重依赖打包工具）。
规模较小时，使用DOM比虚拟DOM快，规模较大时虚拟DOM的计算会速度变慢
DOM diff（虚拟DOM的对比算法）
是什么？
- 一个函数，称之为patch
- patches = patch(oldVNode,newVnode)
- patches就是要运行的DOM操作
大概逻辑
Tree diff
- 将新旧两棵树组逐层对比，找出哪些阶段需要更新
- 如果节点是组件就看Component diff
- 如果节点时标签就看Element diff
Component diff
- 如果节点是组建，就看组件类型
- 类型不同直接替换（删除旧的）
- 类型相同则只更新属性
- 然后深入组件做Tree diff
Element diff
- 如果节点时原生标签，则看标签名
- 标签名不同直接替换，相同则值更新属性
- 然后进入标签后代做Tree diff
