虚拟 dom（virtial dom）了解

vdom 是什么？

vdom 既 virtial dom，也称虚拟 DOM，是一种用 JS 来模拟的 DOM 树结构

真实的 DOM 的结构

JS 模拟的 DOM 结构

你或许会有疑问？为什么使用 JavaScript 来模拟而不是 HTML、CSS？因为 JavaScript 是一门具有图灵完备性的编程语言，能够实现基于逻辑的循环、判断、递归等后期运算，操作 DOM 需要进行复杂运算，而前端三大件中只有 JavaScript 具有这样的功能。

为什么会存在 vdom ？

因为 DOM 操作非常“昂贵”，这里的“昂贵”指的是：

• ECMAScript 和 DOM 是两种东西，每次连接都需要消耗性能。

• 操作 DOM 会导致浏览器重新计算页面的几何变化，从而引发浏览器模板引擎的重排(回流)和重绘，进而更加消耗性能。因此将 DOM 操作放在 JavaScript 层面就是为了更好的优化性能和提高效率。