什么是虚拟DOM？
发布于 2021-01-11 17:00:05
关注者
1
被浏览
1567
4 个回答
-
虚拟 dom 是相对于浏览器所渲染出来的真实 dom 的，在react，vue等技术出现之前，我们要改变页面展示的内容只能通过遍历查询 dom 树的方式找到需要修改的 dom 然后修改样式行为或者结构，来达到更新 ui 的目的。
这种方式相当消耗计算资源，因为每次查询 dom 几乎都需要遍历整颗 dom 树，如果建立一个与 dom 树对应的虚拟 dom 对象（ js 对象），以对象嵌套的方式来表示 dom 树，那么每次 dom 的更改就变成了 js 对象的属性的更改，这样一来就能查找 js 对象的属性变化要比查询 dom 树的性能开销小。
-
虚拟DOM是:用JS来模拟一颗 DOM 树,放在浏览器内存中
当你要改变时,虚拟 DOM 使用 diff 算法进行 新旧虚拟 dom 的比较将修改了的更新到实际的 DOM 树,减少了 DOM 操作 -
结合前面大佬的，组织下自己的话：
相当于真实dom树的映射，用js对象嵌套方式来表示dom树，更新数据时，diff算法先进行新旧虚拟dom的比较修改，再将结果更新到实际的dom树去，减少了dom操作、计算损耗，提高性能 -
个人浅显理解：
VNode是真实DOM的映射，其数据结构是普通JS对象，包含type(类型，是组件还是元素)，style，class，children(子组件或子元素)，data(数据模型)等属性，以树的形式嵌套。
参考--渲染器
