Vue.js 源码学习笔记 - 细节
1. this._eventsCount = { }
这是为了避免不必要的深度遍历:
在有广播事件到来时,如果当前 vm 的 _eventsCount
为 0
,
则不必向其子 vm 继续传播该事件。
2.
数据更新的diff机制
视图更新效率的焦点问题: 大列表的更新 和 深层数据更新
而大列表较为常见
repeat.js
首先diff(data, oldVms) 大概是先比较 新旧两个列表 的vm的数据状态, 然后
差量更新DOM
步骤:
1.遍历 新列表里的 每一项, 如果 该项的vm 之前就存在, 则标记为 _reused
如果不存在对应的vm, 则创建一个新的
(这个vm 个人理解是每个列表每一行数据都有个独立的vm , 存在意思是新列表数据也和vm的数据一样 )
2. 遍历旧列表的每一项, 如果这一项对应对的vm没有被标记为 _reused,
说明新列表不需要利用这个vm, 就马上销毁它
3. 根据新列表item顺序, 整理 新的vm在视图 和 _reused的vm 顺序,
列表更新完成
Vue.js 源码学习笔记 - 细节的更多相关文章
- Vue.js 源码学习笔记
最近饶有兴致的又把最新版 Vue.js 的源码学习了一下,觉得真心不错,个人觉得 Vue.js 的代码非常之优雅而且精辟,作者本身可能无 (bu) 意 (xie) 提及这些.那么,就让我来吧:) 程序 ...
- Vue.js 源码学习笔记 -- 分析前准备1 -- vue三大利器
主体 实例方法归类: 先看个作者推荐, 清晰易懂的 23232 简易编译器 重点: 最简单的订阅者模式 // Observer class Observer { constructor (d ...
- Vue.js 源码学习笔记 -- 分析前准备2 -- Object.defineProperty
解析神奇的 Object.defineProperty 几行代码看他怎么用 var a= {} Object.defineProperty( a, "b", { value ...
- Underscore.js 源码学习笔记(下)
上接 Underscore.js 源码学习笔记(上) === 756 行开始 函数部分. var executeBound = function(sourceFunc, boundFunc, cont ...
- Underscore.js 源码学习笔记(上)
版本 Underscore.js 1.9.1 一共 1693 行.注释我就删了,太长了… 整体是一个 (function() {...}()); 这样的东西,我们应该知道这是一个 IIFE(立即执行 ...
- vue.js源码学习分享(一)
今天看了vue.js源码 发现非常不错,想一边看一遍写博客和大家分享 /** * Convert a value to a string that is actually rendered. *转换 ...
- AlloyTouch.js 源码 学习笔记及原理说明
alloyTouch这个库其实可以做很多事的, 比较抽象, 需要我们用户好好的思考作者提供的实例属性和一些回调方法(touchStart, change, touchMove, pressMove, ...
- move.js 源码 学习笔记
源码笔记: /* move.js * @author:flfwzgl https://github.com/flfwzgl * @copyright: MIT license * Sorrow.X - ...
- lazy-load-img.js 源码 学习笔记及原理说明
lazy-load-img.js? 1. 什么鬼? 一个轻量级的图片懒加载,我个人很是喜欢. 2. 有什么优势? 1.原生js开发,不依赖任何框架或库 2.支持将各种宽高不一致的图片,自动剪切成默认图 ...
随机推荐
- 用python + hadoop streaming 编写分布式程序(一) -- 原理介绍,样例程序与本地调试
相关随笔: Hadoop-1.0.4集群搭建笔记 用python + hadoop streaming 编写分布式程序(二) -- 在集群上运行与监控 用python + hadoop streami ...
- UVa 11134 传说中的车
https://vjudge.net/problem/UVA-11134 题意:在n*n的棋盘上放n个车,使得任意两个车不相互攻击,且第i个车在一个给定的矩形Ri之内.用4个整数xli,yli,xri ...
- jdk、tomcat、solr环境搭建
环境概述 1)操作系统:windows7旗舰版(64位) 2)jdk:jdk-8u131-windows-x64: 3)tomcat:apache-tomcat-9.0.0.M21 4)solr:so ...
- python 等比数列
def is_geometric(li): : return True # Calculate ratio ratio = li[]/]) # Check the ratio of the remai ...
- c++ 匹配相邻元素相等的元素(adjacent_find)
#include <iostream> // cout #include <algorithm> // adjacent_find #include <vector> ...
- 批量删除Redis数据库中的Key
批量删除KeyRedis 中有删除单个 Key 的指令 DEL,但好像没有批量删除 Key 的指令,不过我们可以借助 Linux 的 xargs 指令来完成这个动作 redis-cli keys &q ...
- English trip -- Phonics 5 元音字母 o
Vowel 元音 元音 O Consonant 辅音 清辅音 h wh 浊辅音 m wh n ng y oa:[əʊ] # 字母本身音 coat boat load co ...
- java.lang.UnsupportedClassVersionError: com/my/test/TestUser : Unsupported major.minor version 52.0
问题原因: 1.执行代码的jdk版本 低于 编译的jdk版本 2.项目用JDK1.8运行过,现在又在本地的eclipse等开发工具或者本地环境变量为低版本的jdk1.7或者jdk1.6下运行,ecli ...
- PHP函数总结 (四)
<?php/** * 引用参数: * 1.PHP默认按值传递参数,父程序(调用函数)与子程序(函数)的数值分别存储与不同的内存区块: * 2.引用传递参数,加符号 & :它是把父程序的数 ...
- ubuntu svn二进制文件
1. 查找2:04时间的日志文件和position. Ps:这里假设我找到的是 mysql-bin.000065 位置开始为1356. 2 复制最近的几个日志文件,从mysql-bin.000065 ...