前端大力

想必大家在用JavaScript开发的过程中，不太关心内存的管理，因为对于前端来说，浏览器的内存几乎不会出现用完的情况，因为所接触的是那些短时间执行的场景，比如网页的应用、命令工具等。这类场景由于是运行短时间，且运行在用户的机器上，即使内存被消耗过多或者内存发生了泄漏，已只会影…

这时，我们就会用到一个方法是this.$nextTick（相信你也用过）。 nextTick是全局vue的一个函数，在vue系统中，用于处理dom更新的操作。vue里面有一个watcher，用于观察数据的变化，然后更新dom，vue里面并不是每次数据改变都会触发更新dom，而是…

这篇文章主要围绕Vue的SPA单页面设计展开。 关于如何展开Vue多页面设计请点击查看。 这里指的路由并不是指我们平时所说的硬件路由器，这里的路由就是SPA（单页应用）的路径管理器。 换句话说，vue-router就是WebApp的链接路径管理系统。 vue-router是Vu…

在未出现双向绑定之前，我们需要在各个触发事件方法中直接操作DOM节点来达到修改相应视图的目的。但是当应用一大就会变得难以维护，reflow(回流)很影响性能的。 因此就有人提出来，那我们是不是可以把真实DOM树抽象成一棵以JavaScript对象构成的抽象树，在修改抽象树数据后…

这一章主要讲的是在render的时候如何做到对data中元素进行依赖的收集与监听。 按照之前我们理解的data中依赖收集与监听方法进行绑定则会出现一个问题——span3在实际模板中并没有被用到，然而当span3的数据被修改的时候（this.span3 = 'span4'）的时候…

前面我们用三片文章介绍了compile解析template，完成了 template --> AST --> render function 的过程。这篇我们主要介绍一下VNode的生成过程，在此之前，我们先来简单的了解一下什么是VNode？ 先来看一下Vue.js源码中对VN…

parse，optimize函数的功能，这里，我们主要介绍generate。 generate 函数主要功能就是根据 AST 结构拼接生成 render function 的字符串。 其中 genElement 函数是什么呢？--是会根据 AST 的属性调用不同的方法生成字符串…

上篇文章浅析Vue源码（四）—— $mount中template的编译--parse，我们介绍了compile 的 parse部分，至此我们完成了对一个html字符串模板解析成一个AST语法树的过程。下一步就是我们需要通过optimize方法，将AST节点进行静态节点标记。为后…

通过mount编译代码我们清晰的了解到，在mount的过程中，如果render函数不存在（render函数存在会优先使用render）会将template进行compileToFunctions得到render以及staticRenderFns。譬如说手写组件时加入了templ…