赤蓝紫の博客

Vue源码之虚拟DOM和diff算法(二) 手写diff算法个人练习结果仓库(持续更新)：Vue源码解析patch函数简要流程新旧节点不是同一个虚拟节点(新节点内容是 text)不做过多解释了，代码中已经把每一步都解释了src \ mysnabbdom \ patch.jsimport vnode from './vnode.js'import createElement from './createElement.js'export default function (oldV

Vue源码之虚拟DOM和diff算法(一) 使用snabbdom什么是虚拟DOM和diff算法diff算法简介要把左图装修成右图的样子。(哪里不同？仔细找)有两种方案。方案一：拆掉重建(效率低，代价大)方案二：diff(精细化比对，最小量更新)怎么看都应该会选择方案二。那么在Vue中使用 diff的情景呢?上图就是在Vue中使用 diff的情景(比如左图中，有一些元素的 v-if为false，所以不显示，而右图中， v-if为 true)虚拟DOM简介虚拟DOM：用来描

Vue源码之mustache模板引擎(二)

Vue源码之mustache模板引擎(一)个人练习结果仓库(持续更新)：Vue源码解析抽空把之前学的东西写成笔记。学习视频链接：【尚硅谷】Vue源码解析之mustache模板引擎模板引擎是什么模板引擎是将数据变为视图最优雅的解决方案。其中，Vue中的列表渲染指令v-for就是一种模板引擎。而**插值表达式{{}}**便是本次要研究的mustache模板引擎的语法将数据变为视图的方法纯DOM法很笨拙。需要频繁创建节点，添加数据，添加节点。const arr = [ { '