虚拟dom本质上是一个js对象
在vue中,渲染视图会调用render函数,这种渲染不仅发生在组件创建的时候,还发生在视图依赖的数据更新的时候,如果在渲染时,直接使用真实dom,由于真实dom的创建,更新,插入会带来大量的性能消耗,从而就会极大地降低渲染效率,因此,vue在渲染时,使用虚拟dom来替代真实dom主要是解决渲染效率的问题
每个组件实例首次被渲染时,首先会生成虚拟dom树,然后根据虚拟dom树创建真实dom,再把真实dom挂载到页面合适的地方,此时,每个虚拟dom树对应一个真实dom
当组件受响应式数据变化的影响,需要重新渲染,就会重新调用render函数,生成一个新的虚拟dom树,然后用新的虚拟dom树跟旧的虚拟dom树做比较,通过对比,vue会找到最小更新量,然后更新必要的虚拟dom节点,最后,这些更新过的虚拟dom节点,会去修改它们对应的真实dom,这样一来,就保证了真实dom的达到了最小的改动。