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.支持将各种宽高不一致的图片,自动剪切成默认图 ...
随机推荐
- POJ 2104 K-th Number(主席树模板题)
http://poj.org/problem?id=2104 题意:求区间$[l,r]$的第k小. 思路:主席树不好理解啊,简单叙述一下吧. 主席树就是由多棵线段树组成的,对于数组$a[1,2...n ...
- UVa 12219 公共表达式消除
https://vjudge.net/problem/UVA-12219 题意: 用表达式树来表示一个表达式. 思路: 用map来记录出现过的子树.如(b,3,6)表示这棵子树的根为b,左子树为编号为 ...
- mybatis 关于传long 类型问题
@Datapublic class PrealertPackageStatusDTO { private Integer nowStatus; /** * packageStatusEnum */ p ...
- MVC ---- ckeditor 循环遍历并绑定blur事件
function GetFollowList(page) { , pages: page }; pages = JSON.stringify(pages); var datas = { param: ...
- Linux——用户管理简单学习笔记(四)
主要讲两个用户管理的案例: 1: 限制用户su为root,只允许某个组的的用户su # groupadd sugroup 首先添加我们的用户组 # chmod 4550 /bin/su 改变命令的权限 ...
- JS中dataTransfer对象在拖曳操作中的妙用。
转载 原文 https://my.oschina.net/jiangli0502/blog/179197 dataTransfer对象提供了对于预定义的剪贴板格式的访问,以便在拖曳操作中使用. 通 ...
- PHPStorm默认在新窗口打开
这个设置很实用.
- Python -- xlrd,xlwt,xlutils 读写同一个Excel
最近开始学习python,想做做简单的自动化测试,需要读写excel,然后就找到了xlrd来读取Excel文件,使用xlwt来生成Excel文件(可以控制Excel中单元格的格式),需要注意的是,用x ...
- Redis的介绍
REmote DIctionary Server(Redis) 是一个由Salvatore Sanfilippo写的key-value存储系统. Redis是一个开源的使用ANSI C语言编写.遵守B ...
- oralce表空间使用情况查询
SELECT UPPER(F.TABLESPACE_NAME) TABLESPACE_NAME, -- 表空间名, D.TOT_GROOTTE_MB TOT_GROOTTE_MB, -- 表空间大小( ...