vue为什么采用异步更新

vue为什么要采用异步更新

前言

首先要明确一点：vue是组件级更新,也就是说，每一次的更新都是渲染整个组件，如果是同步的话，一旦修改了data属性，便会触发对应的 watcher，然后调用对应 watcher 下的 update 方法更新视图，那么结果显而易见，太频繁了 ！如下代码：

data(){
   
  a:1,
  b:2,
  c:3
}
//如果是同步的话 修改data中的属性 
//this.a = 2;this.b = 3;this.c = 4;  这样会调用三次update方法渲染视图,很耗性能，用户体验感也不好   

什么是异步更新呢？
异步更新是：Vue会在本轮数据更新后，再去异步更新视图!

下面介绍vue如何实现了异步更新：
原理图：

vue相关源码：

update函数

update () {
   
    /* istanbul ignore else */
    if