Vue.js 3.0 核心源码解析 - 前百度、滴滴资深技术专家 - 拉勾教育
Vue.js 3.0 核心源码内参
HuangYi
Zoom 前端架构师，前百度、滴滴资深技术专家
专属班主任
开篇词
开篇词 | 解析 Vue.js 源码，提升编码能力
模块一：直击 Vue.js 核心组件的实现
模块一导读 | 组件的实现：直击 Vue 核心的实现
01 | 组件渲染：vnode 到真实 DOM 是如何转变的？
02 | 组件更新：完整的 DOM diff 流程是怎样的？（上）
03 | 组件更新：完整的 DOM diff 流程是怎样的？（下）
模块二：学会新设计 Composition API
模块二导读 | 逻辑复用最佳实践：Composition API
04 | Setup：组件渲染前的初始化过程是怎样的？
05 | 响应式：响应式内部的实现原理是怎样的？（上）
08 | 侦听器：侦听器的实现原理和使用场景是什么？（上）
06 | 响应式：响应式内部的实现原理是怎样的？（下）
09 | 侦听器：侦听器的实现原理和使用场景是什么？（下）
10 | 生命周期：各个生命周期的执行时机和应用场景是怎样的？
模块三：编译过程和背后的优化思想
12 | 模板解析：构造 AST 的完整流程是怎样的？（上）
模块三导读 | 编译和优化：了解编译过程和背后的优化思想
13 | 模板解析：构造 AST 的完整流程是怎样的？（下）
14 | AST 转换：AST 节点内部做了哪些转换？（上）
15 | AST 转换：AST 节点内部做了哪些转换？（下）
16 | 生成代码：AST 如何生成可运行的代码？（上）
17 | 生成代码：AST 如何生成可运行的代码？（下）
模块四：探索更多实用特性背后的实现原理
模块四导读 | 实用特性：探索更多实用特性背后的原理
18 | Props：Props 的初始化和更新流程是怎样的？
21 | v-model：双向绑定到底是怎么实现的？
模块五：学习 Vue 内置组件的实现原理
模块五导读 | 内置组件：学习 Vue 内置组件的实现原理
22 | Teleport 组件：如何脱离当前组件渲染子组件？
23 | KeepAlive 组件：如何让组件在内存中缓存和调度？
24 | Transition 组件：过渡动画的实现原理是怎样的？（上）
25 | Transition 组件：过渡动画的实现原理是怎样的？（下）
特别放送：研究 Vue 官方生态的实现原理
特别放送导读 | 研究 Vue 官方生态的实现原理
26 | Vue Router：如何实现一个前端路由？（上）
27 | Vue Router：如何实现一个前端路由？（下）
2021/05/24 HuangYi
你好，我是你的 Vue.js 老师，黄轶。
在课前导读《一文看懂 Vue.js 3.0 的优化》中，我们讲到 Vue.js 3.0 设计了一个很强大的 API —— Composition API，它主要用来优化代码逻辑的组织和复用。
从语法上看，它提供了一个 setup 启动函数作为逻辑组织的入口，暴露了响应式 API 为用户所用，也提供了生命周期函数以及依赖注入的接口，这让我们不依托于 Options API 也可以完成一个组件的开发，并且更有利于代码逻辑的组织和复用。
但是我们要明确一点，Composition API 属于 API 的增强，它并不是 Vue.js 3.0 组件开发的范式，如果你的组件足够简单，你还是可以使用 Options API。
了解了 Composition API 的应用场景和使用方式后，我们需要进一步思考，这样一套 API 是如何设计出来的？它是怎么和组件配合的？在组件整个渲染过程中它又做了哪些事情？带着这些疑问，我们一起来学习这一模块的内容，探索 Composition API 的实现原理。
精选留言
写留言
学习知识要善于思考，思考，再思考。—爱因斯坦
若有收获，就点个赞吧
0 人点赞
