• 数据状态更新时的差异 diff 及 patch 机制
  数据更新视图 之前讲到，在对 model 进行操作对时候，会触发对应 Dep 中的 Watcher 对象。 Watcher 对象会调用对应的 update 来修改视图。 最终是将新产生的 VNode 节点与老 VNode 进行一个 patch 的过程，比对得出「差异」，最终将这些「差异」更新到视图上。 这一章就来介绍一下这个 patch 的过程，因为 patch 过程本身比较复杂，这...
  2021-10-18 13:01:55 | FrontEnd
• template 模板是怎样通过 Compile 编译的
  Compile compile 编译可以分成 parse、optimize 与 generate 三个阶段，最终需要得到 render function。 这部分内容不算 Vue.js 的响应式核心，只是用来编译的，笔者认为在精力有限的情况下不需要追究其全部的实现细节，能够把握如何解析的大致流程即可。 由于解析过程比较复杂，直接上代码可能会导致不了解这部分内容的同学一头雾水。 所以笔...
  2021-10-18 13:01:55 | FrontEnd
• 实现 Virtual DOM 下的一个 VNode 节点
  什么是VNode 我们知道，render function 会被转化成 VNode 节点。 Virtual DOM 其实就是一棵以 JavaScript 对象（VNode 节点）作为基础的树，用对象属性来描述节点，实际上它只是一层对真实 DOM 的抽象。 最终可以通过一系列操作使这棵树映射到真实环境上。 由于 Virtual DOM 是以 JavaScript 对象为基础而不依赖真实...
  2021-10-18 13:01:55 | FrontEnd
• 响应式系统的依赖收集追踪原理
  为什么要依赖收集？ 先举个栗子🌰 我们现在有这么一个 Vue 对象。 new Vue({ template: `<div> <span></span> <span></span> <div>`, data: { ...
  2021-10-18 13:01:55 | FrontEnd
• 响应式系统的基本原理
  响应式系统 Vue.js 是一款 MVVM 框架，数据模型仅仅是普通的 JavaScript 对象，但是对这些对象进行操作时，却能影响对应视图，它的核心实现就是「响应式系统」。 尽管我们在使用 Vue.js 进行开发时不会直接修改「响应式系统」，但是理解它的实现有助于避开一些常见的「坑」，也有助于在遇见一些琢磨不透的问题时可以深入其原理来解决它。 Object.defineProper...
  2021-10-18 13:01:55 | FrontEnd
• Vue.js 运行机制全局概览
  全局概览 这一节笔者将为大家介绍一下 Vue.js 内部的整个流程，希望能让大家对全局有一个整体的印象，然后我们再来逐个模块进行讲解。 从来没有了解过 Vue.js 实现的同学可能会对一些内容感到疑惑，这是很正常的，这一节的目的主要是为了让大家对整个流程有一个大概的认识，算是一个概览预备的过程，当把整本小册认真读完以后，再来阅读这一节，相信会有收获的。 首先我们来看一下笔者画的内部流程...
  2021-10-18 13:01:55 | FrontEnd
• docsify-08-代码高亮
  代码高亮 docsify内置的代码高亮工具是 Prism。 Prism 默认支持的语言如下： Markup - markup, html, xml, svg, mathml, ssml, atom, rss CSS - css C-like - clike JavaScript - javascript, js...
  2021-10-12 13:01:55 | Doc
• docsify-07-Markdown 配置
  Markdown 配置 内置的 Markdown 解析器是 marked，可以修改它的配置。 同时可以直接配置 renderer。 window.$docsify = { markdown: { smartypants: true, renderer: { link: function() { // ... } } ...
  2021-10-12 13:01:55 | Doc