Vue虚拟DOM（VDOM）和diff算法

1. 虚拟DOM 是什么？

虚拟DOM是利用 了js的对象的Object的对象模型来模拟真实DOM, 那么它的结构是一个树形结构

经过多次的VDOM操作之后，通过render函数进行渲染，通过diff算法， 将所有的vdom对比一遍， 找出不同的地方， 然后进行render函数渲染

2. diff算法

diff算法是用来比较两个或是多个文件， 返回值是文件的不同点

diff算法是同级比较的

diff思维也是来自后端

diff算法的比较思维
比较后会出现四种情况：
1、此节点是否被移除 -> 添加新的节点
2、属性是否被改变 -> 旧属性改为新属性
3、文本内容被改变-> 旧内容改为新内容
4、节点要被整个替换 -> 结构完全不相同 移除整个替换

3. 整个VDOM的使用流程（Vue）

• 创建VDOM树
• 利用render函数渲染页面
• 数据改变，生成新的vDOM
• 通过diff算法比较 新 旧 两个VDOM , 将不同的地方进行修改， 相同的地方就地复用 ， 最后在通过render函数渲染页面