在正文开始之前，我们先了解一下vue基于源码构建的两个版本，一个是runtime only(一个只包含运行时的版本)，另一个是runtime + compiler(一个同时包含编译器和运行时的版本)。而两个版本的区别仅在于后者包含了一个编译器。 通俗点讲，编译器是一个提供了将源…

9.1. 模板编译 Vue在挂载实例前，有相当多的工作是进行模板的编译，将template模板进行编译，解析成AST树，再转换成render函数，而有了render函数后才会进入实例挂载过程。对于事件而言，我们经常使用v-on或者@在模板上绑定事件。因此对事件的第一步处理，就是…

Vue 中的 key 是用来做什么的？为什么不推荐使用 index 作为 key？常常听说这样的问题，本篇文章带你从原理来一探究竟。 本文的结论对于性能的毁灭是针对列表子元素顺序被改变、或者子元素被删除的特殊情况，提前说明清楚。 那么它的 vnode 也就是虚拟 dom 节点大…

众所周知，以下代码就是 vue 的一种直接上手方式。通过 cdn 可以在线打开 vue.js。一个文件，一万行源码，是万千开发者赖以生存的利器，它究竟做了什么？让人品味。 源码cdn地址：https://cdn.jsdelivr.net/npm/vue/dist/vue.js，…

Vue的数据响应主要是依赖了Object.defineProperty()，那么整个过程是怎么样的呢？以我们自己的想法来走Vue的道路，其实也就是以Vue的原理为终点，我们来逆推一下实现过程。 例如const obj = {},然后再调用defineReactive(obj,'…

写这个系列主要是记录自己在学习vue源码的一些整理和感悟，文章不会超级详细，也不会一直跟随源码的脚步进行更新，只会抽取出比较重要核心的部分，同时也相当于是自己的学习笔记，方便以后复习查阅。 如果有错误或者疑问也可以在下方评论。就酱！੧ᐛ੭ Vue 是一套用于构建用户界面的渐进式…

。。。 在你自我介绍的时候呢，我就看看你做过的项目，技术栈什么的。 Vue 借鉴了 angular 的模板和数据绑定技术，又借鉴了 react 的组件化和虚拟 DOM 技术。 特点： MVVM 模式；代码简洁体积小，运行效率高，适合移动PC端开发；本身只关注 UI （和 rea…

承接上一篇，我们知道了 Router 初始化过程做了一些什么，而且从http://localhost:8080到http://localhost:8080/#/的过程，那么我们在输入一个路径时，Router 是如何找到对应的组件来渲染的呢，这一篇主要就是介绍这个匹配过程。 我们…

我们在使用 Vue 相关生态的时候，避免不了的会使用到 Vue Router，而关于 Vue Router 背后如何帮助我们管理路由，渲染页面，跳转路径，却知之甚少，这一篇主要从大部分同学使用到的一些场景来分析它的原理。 1. 开始写一个 Router 下面开始一步步分析 Vu…