序言 ​

为什么要写这本书 ​

Vue.js 是当今最流行的前端框架之一，以其渐进式设计、响应式系统和出色的开发体验著称。然而，对于大多数开发者来说，Vue 就像一个"黑盒"——我们熟练地使用 ref、computed、watch，却很少真正理解它们背后的运行机制。

当 Vue 3 发布时，它带来了全新的 Composition API、基于 Proxy 的响应式系统、以及经过重写的编译器和渲染器。这些变化不仅提升了性能，更体现了 Vue 团队对前端框架设计的深刻思考。

这本书的目标很明确：帮助你成为真正的 Vue 3 专家。

我们不仅会从零开始构建一个完整的 mini-vue3，更会深入到源码级别，剖析每一个设计决策背后的权衡与考量。完成这本书后，你将具备：

• 源码级的理解深度：不是"知道怎么用"，而是"知道为什么这样设计"
• 框架设计者的视角：理解性能优化、API 设计、可扩展性之间的平衡
• 独立阅读和调试 Vue 3 源码的能力：遇到问题时能直接从源码找答案
• 参与 Vue 生态贡献的基础：理解如何阅读 RFC、提交 PR、参与讨论

这本书的独特之处 ​

市面上已有一些优秀的 Vue 相关书籍，但本书有以下独特之处：

1. 专家级的深度覆盖 ​

本书包含 20 个部分、143 章，系统覆盖：

• 响应式系统：从基础的 reactive/ref 到 effectScope、性能优化
• 调度器系统：queueJob、nextTick、刷新回调、递归保护机制
• 渲染器与 Diff：从 VNode 设计到三种 Diff 算法的完整实现
• 组件系统：从基础 Props/Slots 到异步组件、函数式组件、自定义指令
• 编译器全流程：词法分析、语法分析、转换优化、代码生成
• SFC 编译：.vue 文件的解析、script setup、scoped CSS
• SSR 实现：服务端渲染、客户端激活、流式渲染
• 性能优化：编译时优化、运行时优化、性能分析工具
• 自定义渲染器：Canvas、Three.js、移动端渲染器
• 源码阅读：仓库结构、调试技巧、RFC 解读、贡献指南

2. 问题驱动的学习路径 ​

每个章节都围绕一个核心问题展开：

• "为什么需要依赖清理？不清理会有什么问题？"
• "双端 Diff 比简单 Diff 快在哪里？快多少？"
• "Block Tree 如何实现靶向更新？节省了多少比较操作？"

3. 从实现到源码的完整闭环 ​

每个核心功能，我们都会：

1. 讲解原理：用通俗的语言解释设计思想
2. 动手实现：提供可运行的最小实现
3. 对比源码：标注对应的 Vue 3 源码位置
4. 讨论权衡：分析设计决策的利弊

这本书适合谁 ​

• 有一定 Vue 使用经验的开发者：你已经熟悉 Vue 的基本用法，想要突破到专家级
• 想要深入理解框架原理的前端工程师：你希望学习现代前端框架的设计思想
• 准备面试高级/架构师岗位的开发者：你需要展示对框架底层的深刻理解
• 想要参与开源贡献的开发者：你希望为 Vue 生态做出贡献

阅读建议 ​

本书内容丰富，建议你：

1. 循序渐进：按照章节顺序阅读，每个部分都建立在前一部分的基础上
2. 动手实践：每个代码示例都亲自实现一遍，不要只是阅读
3. 对比源码：书中会标注 Vue 3 源码位置，建议同步阅读
4. 做笔记和总结：每完成一个部分，写一篇总结加深理解
5. 加入社区讨论：遇到问题时与其他读者交流

预期学习成果 ​

让我们开始这段成为 Vue 3 专家的旅程吧！