前言
如果以简单使用者的角度来学习 vue，当然了解其相关的概念及使用方式足够，但如果是深度用户的话，或多或少会踩到不少框架及底层设计方式带来的不少的坑。比如，我们理所当然的认为，更新了状态，视图层会自动相应的更新，但现实是假如状态中使用到了数组，则我们经常会遇到更新了数组的值后，视图并没有按预期去自动更新， 继续阅读“Vue 是如何进行模板编译的?（一）”
标签：Virtual Dom
前端mvvm框架底层学习（七、双向绑定优化）
前言
上一篇《前端mvvm框架学习（六、最初级的双向绑定）》介绍了我们如何实现一个简单的MVVM对input输入框进行双向绑定的例子，有个历史遗留的问题，就是更新数据会失去焦点。这一篇我们再来优化之前的双向绑定，怎么简单怎么来吧，我们还是引用lodash库和还是用传统的方式拼接html字符串的方式来处理View层吧，还是使用模版函数来处理，直接用lodash的template函数，但在这里，我们引入了高级的玩意，我们引入了snabbdom的全家桶，一个最为流行的virtual dom解决方案。 继续阅读“前端mvvm框架底层学习（七、双向绑定优化）”
关于Virtual Dom的那些事（五）
前言
上一篇《关于Virtual Dom的那些事（四）》主要是介绍了Thunk概念，加上之前所有有的内容都只是snabbbom的前菜，本篇直接分析其200 SLOC（Source Lines of Code），大概200行的核心代码。并附上其它剩余所有代码的源码分析。 继续阅读“关于Virtual Dom的那些事（五）”
关于Virtual Dom的那些事（四）
前言
上一篇《关于Virtual Dom的那些事（三）》主要是介绍了生成VNode的几种方式。翻一翻snabbdom的源码，我看还可以看到一个概念-Thunk，Thunk是什么？在react全家桶中经常会看到Thunk这概念，在计算机语言中是传名调用的意思，但如果按我个人的理解就是中间件的概念，更通俗一点就是在某函数的每次输入与输出之间，预加一个自定义的拦截处理函数（thunk函数）， 继续阅读“关于Virtual Dom的那些事（四）”
关于Virtual Dom的那些事（三）
前言
上一篇《关于Virtual Dom的那些事（二）》主要是介绍了VNode。其实生成VNode的方式在snabbdom中除了VNode自身的最基本的构造函数vnode()外，还有两种方式来生成。一种是toVNode（即把原生的Dom转化成为VNode），还有一种是非常有名的h函数（hyperscript最原始的定义是“Create HyperText with JavaScript.”）。本节主要是分析一下这两种函数在snabbdom中的源码。 继续阅读“关于Virtual Dom的那些事（三）”
关于Virtual Dom的那些事（二）
前言
上一篇《关于Virtual Dom的那些事（一）》在最后之处讲到Virtual Dom 主要涉及的概念。本篇将紧跟着并结合snabbdom的源码来讲讲其中的第一点“VNode”。既然是Virtual Dom，那当然其结构里面的Node节点相应也有VNode的概念。其组织形式按理来说应该与真实的Node节点类似才对。
真实Dom由些什么组成呢？
关于 Virtual Dom 的那些事（一）
前言
一直想写点关于 Virtual Dom 的东西。以前刚开始接触 react 的时候就已经接触到了 Virtual Dom 和 diff 算法的概念，但一直觉得这些都是很复杂，很高深的东西。后面使用 react，使用 Vue 多了，逐渐觉得这些概念没那么陌生了。但还是觉得各种开源的 Virtual Dom，React 等对 Virtual Dom 的实现的源码不太容易读懂，源码的注释不全是一大障碍，直到遇到了 snabbdom，才开始觉得有深究其源码的冲动。