Vue源码学习日记

前言 大家好，我是咸鱼，之前断更了一个月，在这里说声抱歉(ps：前天发的文章太短了，不能算数)，今天这篇文章的注意内容是带着大家去了解Vue3中的调度系统，了解调度系统的执行流程，并且能够把之前分析的

前言 在前面的几篇文章中，我们把vue3的编译原理进行了详细分析，从template转换成AST到优化AST，再到通过优化过的AST生成渲染函数，每一步都缺一不可，可以说是一环扣一环，但这都是理想状态

前言 经过前面的编译成AST、AST树优化，我们得到了一个便于产生渲染函数的AST树。渲染函数在生成的过程中其实是字符串，会根据AST树的情况拼接进不同的语句，在最末尾才会把它变成一个函数 在正式开始

前言 继续了解vue transform阶段的流程。 transformeElement 分析元素的处理流程过于庞大的，并且大部分的逻辑都是在处理自身的所有的节点的才会执行，我们只去看主要的逻辑。 首

transform阶段是对AST树的升华，可以让其在generate阶段更好的产生的渲染函数，这里我们只关心内置的transform，用户的transfomr不去看。

vue中对模板转换成AST树的过程中，使用了大量的字符串的操作，这虽然是考虑了很多边界情况，这也提示着我们，在开发的过程中，能够考虑更多的情况。

前言 本篇文章是对上一篇文章diff算法的补充，介绍了Fragment的更新，为什么不要使用index key，以及vue中的最长递增子序列算法

清楚vue中diff算法的处理流程，知道每一个节点对比如何进行，如何书写模板可以进行最优的对比、复用节点，从而提高性能，

将前面文章所遗漏的细节进行分析，比如setup函数的结果处理，v2兼容处理等等，让前面的流程更加完善。

了解vue是如何将插槽内容渲染到指定位置，在有多个插槽的情况，如何按照名字找到渲染位置，如何处理用户传递的内容，作用域插槽的数据是如何传递和使用，在开发中可以更好的使用插槽。

分析vue的DOM初始化挂载，分析每一种类型节点是如何进行初始化挂载的，做了那些优化。ok，就这些，

分析vue初始化和更新props和attr，了解它们是如何工作的，可以帮助我们在vue开发的过程中更加有效的使用props和attrs。

前言 vue3更新了两个全新的内置组件，Teleport和Suspense。让我们在实现某些效果的时候，如拟态框、异步加载等，变得十分方便，我就很好奇，其内部是如何实现的。在我研究了两天之后，发现其内

前言 今天这篇文中是对vue3中所有的响应式API做一个原理解析，其中有一些已经前面的几篇文中讲解了，reactive、shallowReactive、readonly、shallowReadonly

前言 vue的一个重要的功能，数据响应式，也就是当数据更新时，vue会自动的去更新模板中所有与被修改数据相关的所有数据，有一个关键点，模板如何知道使用了什么数据，数据如何知道模板什么地方用到了自己，这

入口函数 createApp vue2的入口函数是一个构造函数 Vue并且要实例化才能使用，到了vue3 入口函数变成一个单独的函数createApp我们可以打一个断点进入到入口函数内部去看看 (文件

前言 这篇文章的内容是vue另一个常见重要的API ref 实现的思路是有一个容器存储的值，有两个方法，一个用于调用 trackEffect 收集依赖，一个用于调用 triggerEffect 触发依

前言 在上一篇中，简单的看了一下 reactive实现方法，其中有两个文件，专门给reactive、shallowReactive、readonly、shallowReadonly 提供拦截方法，文件

Vue3 使用了新的方式进行响应式处理ES6 Proxy对象，并且也对ES6新增的数据类型：数组集合，也进行响应处理（Vue2没有对数组集合进行响应式处理） reactive api 的源代码地址在