什么是虚拟Dom、diff算法

虚拟Dom（virtual dom）是一个js对象，用来模拟真实dom中的节点结构。

为什么使用virtual dom？（dom的优化原理）

虚拟dom采用object对象的写法， 极大的提升了我们使用dom操作网页的性能。

虚拟dom的生成过程：

1. 获取数据
2. 创建vdom
3. 通过render函数解析jsx，将其转换成 vdom结构
4. 将vdom转换为真实dom
5. 数据更改
6. 使用diff算法，调用patch函数对比两次dom不同
7. 根据key将patch对象渲染到页面中改变的结构上，而其他没有改变的地方是不做任何修改的（ 虚拟dom的惰性原则 ）

上面说到了diff算法，diff是什么？

很简单，

一种算法用来找出变化前后 vdom的不同的。

实现过程也很简单：

diff的过程就是调用名为patch的函数，比较新旧节点，一边比较一边给真实的DOM打补丁

很抽象的一张图：

不过能表达出意思即可