vue 虚拟dom

原生js操作DOM的代价是非常昂贵的，因为浏览器在加载html文档的时候，大概经历以下过程：

1、解析html，构建DOM树

2、解析css，构建css树

3、合并DOM树和css规则，生成render树

4、布局render树，负责元素尺寸，位置的计算

5、绘制render树

6、浏览器将信息发送到GPU,GPU将各层合成

在改变DOM 结构时 ，浏览器会将受影响的DOM部分重新排列，这个过程称为重排，之后，在将这些内容全部绘制到屏幕，这个过程称为重绘。

虚拟DOM virtual dom

就是在生成一个虚拟的DOM，生成在内存中，而不是浏览器，这时候在修改dom结构的时候，会现在内存中修改，再渲染到浏览器页面，这样将大大减少时间，优化效率。

vue3中则先获取动态的节点 vue2则是所有全进行diff比对