有关虚拟DOM

Virtual DOM是对DOM的抽象,本质是JavaScript对象,这个对象就是更加轻量级的对DOM的描述
现代前端框架的一个基本要求就是无须手动操作DOM,一方面是因为手动操作DOM无法保证程序性能,多人协作的项目中如果review不严格,可能会有开发者写出性能较低的代码;另一方面是省略手动DOM操作可以大大提高开发效率
Virtual DOM最初的目的就是更好的跨平台,比如Node就没有DOM,如果想实现SSR(服务端渲染),那么一个方式就是借助Virtual DOM,因为Virtual DOM本身就是JavaScript对象

1. Virtual DOM的创建(vnode函数)

2. Virtual DOM Tree的创建(h函数)

3. Virtual DOM更新(将vnode转化为真实DOM)

4. Virtual DOM的diff(比较新旧Virtual DOM Tree找出差异并更新)

5. Virtual DOM的优化(snabbdom.js,采用双端比较算法,inferno.js的diff算法是目前最快的算法,采用利用LIS(最长递增子序列)的思想做动态规划,找到最小移动次数)

有关diff算法,可以参考虚拟DOM中的diff算法的总结