既然Vue通过数据劫持可以精准探测数据变化,为什么还需要虚拟DOM进行diff监测差异
现代前端框架变化侦测的方式主要有pull和push
-
pull:
pull的代表框架是React -
push:
Vue的响应式系统侦测变化的方式是push,vue程序初始化时就会对数据data进行依赖的收集,一旦数据发生变化,响应式系统就会立刻知道,因此vue在刚开始就知道在哪发生了变化
但是会产生一个问题,通过响应式绑定的数据都会有一个Watcher,一旦我们的绑定细粒度过高,就会有大量的Watcher,这会带来内存和依赖追踪上的开销;细粒度过低又会无法精准侦测变化,所以Vue的设计选择中等绑定细粒度的方案,在组件级别进行push侦测的方式,也就是那套响应式系统
通常在一开始时我们就知道发生变化的是哪个组件,然后用Virtual Dom Diff进行具体的差异检测,因为Virtual Dom Diff是pull的操作,所以Vue采用的是pull+push的方式侦测变化