上一主题 下一主题
ScriptCat,新一代的脚本管理器脚本站,与全世界分享你的用户脚本油猴脚本开发指南教程目录
返回列表 发新帖

vue计算函数新旧变化

[复制链接]
  • TA的每日心情
    擦汗
    昨天 09:20
  • 签到天数: 192 天

    [LV.7]常住居民III

    687

    主题

    5428

    回帖

    6365

    积分

    管理员

    非物质文化遗产社会摇传承人

    积分
    6365

    荣誉开发者管理员油中2周年生态建设者喜迎中秋

    发表于 2022-1-2 01:23:07 | 显示全部楼层 | 阅读模式

    前文

    只是自己的一次无聊想法

    很基础的内容

    大佬不要嘲笑

    computed变化

    vue对computed进行了响应优化

    这里拿了2.5.6和2.5.17做对比

    图片.png

    2.5.17提示的是RangeError: Maximum call stack size exceeded

    具体改变在于哪呢?

    在源码的Watcher.prototype.update位置

    图片.png

    看注释和代码来说,大概意思是早期是判断deps是否为0,如果为0则再下轮访问刷新,否则立即刷新

    但是新版无论是否进行notify,都会下轮访问才进行刷新

    也就是说内部修改变量已经无法触发刷新了

    新版则是收集dep之后,一旦网页访问compute函数,则同时对所有函数的user watch收集的dep也进行一次依赖响应

    来让依赖也拿到渲染watch

    一旦对其变量进行修改

    则变量会对user watch做一个dirty处理

    然后触发渲染watch刷新

    渲染watch获取computed属性,触发重新计算值

    而旧版的逻辑则是

    一旦变量更新通知user watch,获取值之后,再由user watch通知渲染watch进行更新

    Watcher.prototype.update = function update () {
        var this$1 = this;
    
      /* istanbul ignore else */
      if (this.computed) {
        // A computed property watcher has two modes: lazy and activated.
        // It initializes as lazy by default, and only becomes activated when
        // it is depended on by at least one subscriber, which is typically
        // another computed property or a component's render function.
        if (this.dep.subs.length === 0) {
          // In lazy mode, we don't want to perform computations until necessary,
          // so we simply mark the watcher as dirty. The actual computation is
          // performed just-in-time in this.evaluate() when the computed property
          // is accessed.
          this.dirty = true;
        } else {
          // In activated mode, we want to proactively perform the computation
          // but only notify our subscribers when the value has indeed changed.
          this.getAndInvoke(function () {
            this$1.dep.notify();
          });
        }
      } else if (this.sync) {
        this.run();
      } else {
        queueWatcher(this);
      }
    };
    混的人。
    ------------------------------------------
    進撃!永遠の帝国の破壊虎---李恒道

    入驻了爱发电https://afdian.net/a/lihengdao666
    个人宣言:この世界で私に胜てる人とコードはまだ生まれていません。死ぬのが怖くなければ来てください。
    头像被屏蔽

    该用户从未签到

    0

    主题

    12

    回帖

    19

    积分

    禁止访问

    积分
    19
    发表于 2022-1-9 13:47:19 | 显示全部楼层
    :):lol:loveliness:
    回复

    使用道具 举报

    发表回复

    本版积分规则

    快速回复 返回顶部 返回列表