Vue3源码解析,打造自己的Vue3框架,领悟尤大思维精髓 [完结]
- {1}-第1章 课程导读
- 1-1课程导读0939
- {2}-第2章 框架设计前瞻 - 框架设计中的一些基本概念
- 2-1前言0154
- 2-2编程范式之命令式编程0619
- 2-3编程范式之声明式编程0427
- 2-4命令式VS声明式0721
- 2-5企业应用的开发与设计原则0656
- 2-6为什么说框架的设计过程其实是一个不断取舍的过程0549
- 2-7vue中的html是真实的html吗0456
- 2-8什么是运行时1716
- 2-9什么是编译时0744
- 2-10运行时编译时1619
- 2-11什么是副作用0407
- 2-12Vue3框架设计概述0447
- 2-13扩展所谓良好的`TypeScript`支持是如何提供的0611
- 2-14总结0104
- {3}-第3章 Vue 3源码结构 - 搭建框架雏形
- 3-1前言0127
- 3-2探索源码设计Vue3源码设计大解析1145
- 3-3创建测试实例在Vue源码中运行测试实例0901
- 3-4跟踪解析运行行为为vue开启SourceMap0906
- 3-5授人以鱼如何针对源码进行debugger0506
- 3-6授人以渔如何阅读源码0724
- 3-7开始搭建自己的框架创建vue-next-mini0602
- 3-8为框架进行配置导入ts0744
- 3-9引入代码格式化工具prettier让你的代码结构更加规范0610
- 3-10模块打包器rollup1238
- 3-11初见框架雏形配置路径映射0516
- 3-12总结0127
- {4}-第4章 响应系统 - 响应系统的核心设计原则
- 4-1前言0150
- 4-2JS的程序性0435
- 4-3如何让你的程序变得更加聪明0524
- 4-4vue2的响应性核心APIObjectdefineProperty0819
- 4-5ObjectdefineProperty在设计层的缺陷0859
- 4-6vue3的响应性核心APIproxy1420
- 4-7proxy的最佳拍档Reflect拦截js对象操作1513
- 4-8总结0151
- {5}-第5章 响应系统 - 初见 reactivity 模块
- 5-1前言0155
- 5-2源码阅读reactive的响应性跟踪Vue3源码实现逻辑12125
- 5-3源码阅读reactive的响应性跟踪Vue3源码实现逻辑21703
- 5-4框架实现构建reactive函数获取proxy实例1257
- 5-5框架实现什么是WeakMap它和Map有什么区别0919
- 5-6框架实现createGettercreateSetter0933
- 5-7热更新的开发时提升开发体验0314
- 5-8框架实现构建effect函数生成ReactiveEffect实例0702
- 5-9框架实现tracktrigger0557
- 5-10框架实现构建track依赖收集函数0538
- 5-11框架实现构建trigger触发依赖0347
- 5-12总结单一依赖的reactive0356
- 5-13功能升级响应数据对应多个effect0438
- 5-14框架实现构建Dep模块处理一对多的依赖关系0818
- 5-15reactive函数的局限性0510
- 5-16总结0126
- {6}-第6章 响应系统 - ref 的响应性
- 6-1前言0106
- 6-2源码阅读ref复杂数据类型的响应性11530
- 6-3源码阅读ref复杂数据类型的响应性21252
- 6-4框架实现ref函数-构建复杂数据类型的响应性1059
- 6-5总结ref复杂数据类型的响应性0148
- 6-6源码阅读ref简单数据类型的响应性1111
- 6-7框架实现ref函数-构建简单数据类型的响应性0539
- 6-8总结ref简单数据类型响应性0245
- 6-9总结0249
- {7}-第7章 响应系统 - watch && computed
- 7-1开篇0104
- 7-2源码阅读computed的响应性跟踪Vue3源码实现逻辑11553
- 7-3源码阅读computed的响应性跟踪Vue3源码实现逻辑21636
- 7-4框架实现构建ComputedRefImpl读取计算属性的值1032
- 7-5框架实现computed的响应性初见调度器处理脏的状态1021
- 7-6框架实现computed的缓存性2423
- 7-7总结computed计算属性0118
- 7-8源码阅读响应性的数据监听器watch跟踪源码实现逻辑11940
- 7-9源码阅读响应性的数据监听器watch跟踪源码实现逻辑21713
- 7-10框架实现深入scheduler调度系统实现机制2526
- 7-11框架实现初步实现watch数据监听器1857
- 7-12问题分析watch下的依赖收集原则0524
- 7-13框架实现完成watch数据监听器的依赖收集0331
- 7-14总结watch数据侦听器0152
- 7-15总结0207
- {8}--第8章runtime运行时-运行时核心设计原则
- [8.1]--8-1前言
- [8.2]--8-2HTMLDOM节点树与虚拟DOM树
- [8.3]--8-3挂载与更新
- [8.4]--8-4h函数与render函数
- [8.5]--8-5运行时核心设计原则
- [8.6]--8-6总结
- {9}--第9章runtime运行时-构建h函数,生成Vnode
- [9.1]--9-1前言(
- [9.2]--9-2阅读源码:初见h函数,跟踪Vue3源码实现基础逻辑(1)(
- [9.4]--9-4框架实现:构建h函数,处理ELEMENT+TEXT_CHI(
- [9.5]--9-5源码阅读:h函数,跟踪ELEMENT+ARRAY_CHIL(
- [9.6]--9-6框架实现:构建h函数,处理ELEMENT+ARRAY_CH(
- [9.7]--9-7源码阅读:h函数,组件的本质与对应的VNode(
- [9.8]--9-8框架实现:处理组件的VNode(
- [9.9]--9-9源码阅读:h函数,跟踪Text、Comment、Fragm(
- [9.10]--9-10框架实现:实现剩余场景Text、Comment、Frag(
- [9.11]--9-11源码阅读:对class和style的增强处理(
- [9.12]--9-12框架实现:完成虚拟节点下的class和style的增强(
- [9.13]--9-13总结(
- {10}--第10章runtime运行时-构建renderer渲染器
- [10.1]--10-1前言(
- [10.2]--10-2源码阅读:初见render函数,ELEMENT节点的挂载(
- [10.3]--10-3框架实现:构建renderer基本架构(
- [10.4]--10-4框架实现:基于renderer完成ELEMENT节点挂载(
- [10.5]--10-5框架实现:合并渲染架构,得到可用的render函数(
- [10.7]--10-7框架实现:渲染更新,ELEMENT节点的更新实现(
- [10.8]--10-8源码阅读:新旧节点不同元素时,ELEMENT节点的更新操(
- [10.9]--10-9框架实现:处理新旧节点不同元素时,ELEMENT节点的更(
- [10.10]--10-10框架实现:删除元素,ELEMENT节点的卸载操作(
- [10.11]--10-11源码阅读:class属性和其他属性的区分挂载(
- [10.12]--10-12深入属性挂载:HTMLAttributes和DOMPr(
- [10.13]--10-13框架实现:区分处理ELEMENT节点的各种属性挂载(
- [10.14]--10-14源码阅读:ELEMENT节点下,style属性的挂载和(
- [10.15]--10-15框架实现:ELEMENT节点下,style属性的挂载和(
- [10.16]--10-16源码阅读:ELEMENT节点下,事件的挂载和更新(
- [10.17]--10-17深入事件更新:vueeventinvokers(
- [10.18]--10-18框架实现:ELEMENT节点下,事件的挂载和更新(
- [10.19]--10-19局部总结:ELEMENT节点的挂载、更新、props打(
- [10.20]--10-20源码阅读:renderer渲染器下,Text节点的挂载(
- [10.21]--10-21框架实现:renderer渲染器下,Text节点的挂载(
- [10.22]--10-22源码阅读:renderer渲染器下,Comment节点(
- [10.23]--10-23框架实现:renderer渲染器下,Comment节点(
- [10.24]--10-24源码阅读:renderer渲染器下,Fragment节(
- [10.25]--10-25框架实现:renderer渲染器下,Fragment节(
- [10.26]--10-26总结(
- {11}--第11章runtime运行时-组件的设计原理与渲染方案
- [11.2]--11-2源码阅读:无状态基础组件挂载逻辑(
- [11.3]--11-3源码阅读:无状态基础组件挂载逻辑(
- [11.4]--11-4框架实现:完成无状态基础组件的挂载逻辑(
- [11.5]--11-5源码阅读:无状态基础组件更新逻辑(
- [11.6]--11-6局部总结:无状态组件的挂载、更新、卸载总结(
- [11.7]--11-7源码阅读:有状态的响应性组件挂载逻辑(
- [11.8]--11-8框架实现:有状态的响应性组件挂载逻辑(
- [11.10]--11-10框架实现:组件生命周期回调处理逻辑(
- [11.11]--11-11源码阅读:生命回调钩子中访问响应性数据(
- [11.12]--11-12框架实现:生命回调钩子中访问响应性数据(
- [11.13]--11-13源码阅读:响应性数据改变,触发组件的响应性变化(
- [11.14]--11-14框架实现:响应性数据改变,触发组件的响应性变化(
- [11.15]--11-15源码阅读:compositionAPI,setup函数(
- [11.16]--11-16框架实现:compositionAPI,setup函数(
- [11.17]--11-17总结(
- {12}--第12章runtime运行时-diff算法核心实现
- [12.1]--12-1前言(
- [12.2]--12-2前置知识:VNode虚拟节点key属性的作用(
- [12.3]--12-3源码阅读:场景一:自前向后的diff对比(
- [12.4]--12-4框架实现:场景一:自前向后的diff对比(
- [12.5]--12-5源码阅读:场景二:自后向前的diff对比(
- [12.6]--12-6框架实现:场景二:自后向前的diff对比(
- [12.7]--12-7源码阅读:场景三:新节点多余旧节点时的diff比对(
- [12.8]--12-8框架实现:场景三:新节点多余旧节点时的diff比对(
- [12.9]--12-9源码阅读:场景四:旧节点多于新节点时的diff比对(
- [12.10]--12-10框架实现:场景四:旧节点多于新节点时的diff比对(
- [12.11]--12-11局部总结:前四种diff场景的总结与乱序场景(
- [12.12]--12-12前置知识:场景五:最长递增子序列(
- [12.13]--12-13源码逻辑:场景五:求解最长递增子序列(
- [12.14]--12-14源码阅读:场景五:乱序下的diff比对(
- [12.15]--12-15源码阅读:场景五:乱序下的diff比对(
- [12.16]--12-16框架实现:场景五:乱序下的diff比对(
- [12.17]--12-17总结(
- {13}--第13章compiler编译器-编译时核心设计原则iclass=
- [13.1]--13-1前言(
- [13.2]--13-2模板编译的核心流程(
- [13.3]--13-3抽象语法树-AST(
- [13.4]--13-4AST转化为JavaScriptAST,获取codege(
- [13.5]--13-5JavaScriptAST生成render函数代码(
- [13.6]--13-6总结(
- {14}--第14章compiler编译器-构建compile编译器
- [14.1]--14-1前言(
- [14.2]--14-2扩展知识:JavaScript与有限自动状态机(
- [14.3]--14-3扩展知识:扫描tokens构建AST结构的方案(
- [14.4]--14-4源码阅读:编译器第一步:依据模板,生成AST抽象语法树(
- [14.5]--14-5框架实现:构建parse方法,生成context实例(
- [14.6]--14-6框架实现:构建有限自动状态机解析模板,扫描token生成(
- [14.7]--14-7框架实现:生成AST,构建测试(
- [14.8]--14-8扩展知识:AST到JavaScriptAST的转化策略和(
- [14.9]--14-9源码阅读:编译器第二步:转化AST,得到JavaScri(
- [14.10]--14-10框架实现:转化JavaScriptAST,构建深度优先(
- [14.11]--14-11框架实现:构建transformXXX方法,转化对应节(
- [14.12]--14-12框架实现:处理根节点的转化,生成JavaScriptA(
- [14.13]--14-13扩展知识:render函数的生成方案(
- [14.14]--14-14源码阅读:编译器第三步:生成render函数(
- [14.15]--14-15框架实现:构建CodegenContext上下文对象(
- [14.16]--14-16框架实现:解析JavaScriptAST,拼接rend(
- [14.17]--14-17框架实现:新建compat模块,把render转化为f(
- [14.18]--14-18总结(
- {15}--第15章compiler编译器-深入编辑器处理逻辑(困难)
- [15.1]--15-1前言(
- [15.2]--15-2响应性数据的编辑器处理:响应性数据的处理逻辑(
- [15.3]--15-3响应性数据的编辑器处理:AST解析逻辑(
- [15.4]--15-4响应性数据的编辑器处理:JavaScriptAST转化逻(
- [15.5]--15-5响应性数据的编辑器处理:render转化逻辑分析(
- [15.6]--15-6响应性数据的编辑器处理:generate生成render(
- [15.7]--15-7响应性数据的编辑器处理:render函数的执行处理(
- [15.8]--15-8多层级模板的编辑器处理:多层级的处理逻辑(
- [15.9]--15-9基于编辑器的指令(v-xx)处理:指令解析的整体逻辑(
- [15.10]--15-10困难-基于编辑器的指令(v-xx)处理:AST解析逻辑(
- [15.11]--15-11困难-基于编辑器的指令(v-xx)处理:JavaScr(
- [15.13]--15-13基于编辑器的指令(v-xx)处理:生成render函数(
- [15.14]--15-14总结(
- 15-12 基于编辑器的指令(v-xx)处理:JavaScript AST ,transform 的转化逻辑(
- {16}--第16章运行时+编译时-合并vue处理逻辑
- [16.2]--16-2基于render渲染的createApp的构建逻辑(
- [16.3]--16-3基于template渲染的createApp的构建逻辑(
- [16.4]--16-4总结(
- {17}--第17章课程总结
- 总结