Vue.js 官方团队成员霍春阳新作，深入解析 Vue.js 设计细节

Posted 2022-02-23 turingbooks

霍春阳（Hcy），Vue.js 官方团队成员。专注于 Web 研发领域，是 Vue.js 3 的核心贡献者之一，Vue.js 文档生成工具 Vuese 的作者，技术社区活跃者，曾撰写大量颇受好评的技术博客。

经过一年的准备，霍春阳的新书《Vue.js设计与实现》正式出版了！预售一周就已重印，刷新了近两年的图书重印记录。‍

坊间流传着很多有关他的传奇经历，很多人对他的经历都非常好奇。今天这篇文章让大家走近霍春阳，了解一个真实的他，一个喜欢把事情做到极致的人，一个喜欢“留下点什么”的开发者。

---

大家好，我是霍春阳（Hcy）。

很开心的和大家分享一个消息：我的新书《Vue.js 设计与实现》出版了。

从 2021 年初开始准备这本书，到今天正式出版，很开心一切都能够按部就班的进行，虽然中间因疫情原因耽搁了一些，但整体上是在轨的。这里必须要感谢出版社里各位尽职尽责的工作人员，尤其是王军花老师。

借着这个机会我想和读者分享一些关于本书和我，以及 Vue.js 的一些事情。就从为什么要写这本书开始吧。

为何要写这本书？

这确实也是值得我本人深思的一件事儿。我想从两个方面来阐述我写这本书的原因：

• “干一行，爱一行”

• “留下点什么”

知乎上有一个问题：“你做程序员真的是因为热爱吗？”。我回答了这个问题，感兴趣的朋友可以在这里了阅读完整的回答：你做程序员真的是因为热爱吗？

大意是，恰好写代码这事儿能赚钱。而我是属于那种“干一行，爱一行”的人，它讲的是一种职业精神，即无所谓做哪个行业，但只要确定了一个行业，那么就能全身心的投入，并能够因为这种投入和达到的成就让你真正的爱上这个行业，即所谓的“干一行，爱一行”。

从小我就有一个特殊的习惯（也许是怪癖），我也不知道是从什么时候、什么原因让我产生并保持这种习惯。这个习惯是：“留下点什么”。

小时候家里有一台黑白电视机，每天播放的内容大概会在电视剧、广告、动画片之间反复。然后突然有一天我就想，如何能证明我看过电视的内容呢？

为了能够证明这一点，我就会根据电视剧、广告、动画片这几个栏目对电视的内容进行分类并写在纸上，一旦电视切换了播放内容，我就会在纸上对应的分类后面画一道竖线。

这样一来，纸上的竖线就能够证明我看过电视了，而这些竖线就是我看电视这件事情“留下来”的东西。这会给我一种莫名的“充实”感。

类似的事情还有很多。例如，每年秋收的时候家里用水稻脱粒机对水稻进行脱粒处理，脱粒后的水稻会被灌进编织袋中，由于脱粒的计费方式是按照最终水稻的袋数来算钱的，因此每灌满一个编织袋都会记一次数量。

计数方式也很有意思，由于“正”字的笔画数量正好是 5，两个“正”字就代表 10 袋。当时，我最喜欢的事情就是拿着粉笔在黑色木板上帮大人们记数。因为这种行为很符合“留下点什么”的审美。

再如，小时候玩游戏机（插游戏卡的那种），无论什么游戏，我都喜欢在游戏结束之后拿笔和纸记录下局次，输赢结果等，以便代表我确实玩过这些游戏，而记录下来的这些内容，就是我玩游戏这个行为“留下来”的东西。

回到这个问题本身，我为什么要写这本书？

很简单，我想“留下点什么”，以证明我确实为 Vue.js 做过贡献。我很享受写这本书的过程，它让我感到很“充实”，留下了一些东西的那种充实。

以写代码为职业，“干一行，爱一行”的性格让我更加敬业，并成为 Vue.js 的团队成员。如果还能“留下点什么”，那这种“诱惑”对我来说简直无法抗拒。若是“留下的这些东西”还能够为读者、为 Vue.js 社区带来一些帮助的话，那真的是完美了。

而更加庆幸的一点是，真的有很多读者私信我并表达了对这本书的期待。在一定程度上，我个人觉得我也非常适合编写这么本书，其中一个最大的原因是：我认为我能与绝大部分读者产生共鸣。

通常来说，学习一项技术只需要掌握其核心思想即可，而无需事无巨细地深入细节。这样的学习方式有一定好处，但同时会给人一种“虚”的感觉。

就像上学时学习操作系统课程一样，如果你不跟着课程完成对应的实验，实际修改一下操作系统的代码，而只是学习一些进程、线程、文件系统、虚拟内存的抽象概念，虽然能够在一定程度上理解，但始终觉得不踏实。

同样的，学习前端框架也是一样的道理。基于这个原因，这本书则照顾到了两个方面。

一方面，它从全局视角介绍了框架设计及其各个方面的权衡；另一方面，也从具体的代码出发，真正地将功能实现，并在此过程中让读者能够切身感受并学习其中的难点和解决方案。

我的确花费了很大精力编写本书，共 500 页，希望它的内容不会让你们失望。同时由于我的水平有限，有任何疏漏望不吝指出。

Vue.js 3 仍然在更新，

这本书会过时吗？

这其实是一个好问题，也是我愿意强调的一个问题。简单来说，答案是：不会。

这本书并非一本“源码解读”书籍，而是建立在笔者对 Vue.js 3 的理解之上，以由简入繁的方式介绍 Vue.js 3 中各个功能模块的设计与实现。同时辅以足够的“细节”，旨在帮助读者能够更轻松、更自然地理解 Vue.js 3 的框架机理。

举个例子，本书在介绍 Vue.js 3 中基于 Proxy 实现的响应系统时，并没有照猫画虎地照搬 Vue.js 源码中的实现，并基于此反推代码的运行机制。

而是会从 ECMAScript 的规范入手，详细地阐述 javascript 对象的本质，以及创建代理对象（Proxy）的内在原理，并基于此从 0 开始，一点一点地构建整个完善的响应系统。

这样做的好处在于，读者能够了解代码的发展路径，真正的做到知其然并知其所以然。

再如，在模板编译的章节中。本书同样带领读者从 WHATWG 的规范入手，详细地介绍了文本模式的概念以及其对解析器的影响。

在编写模板编译器的过程中，还会涉及到字符引用的解码，这些内容都需要从规范入手才能真正地理解“为什么”。幸运的是，本书会带领读者阅读并理解相关的规范。

因此，我认为这本书是不会过时的。尤其是书中介绍的方法论，任何代码的背后都需要有一个“原因”来支撑。

这个“原因”是多样性的，它可能是某一个规范（如 ECMAScript 规范或 WHATWG 中关于 html 的解析规范），也可能是某个浏览器的 Bug，更可能是工具或语言的 limitation。

如何为 Vue.js 社区做贡献？

为 Vue.js 社区做贡献的方式是多种多样的，我们欢迎任何种类的贡献，无论哪一种贡献，都值得给予足够的尊重。

对于这本书而言，我也将其定义成是为 Vue.js 社区做贡献的一种方式，旨在帮助大家更好的学习并使用 Vue.js。

社区里存在着各种各样的角色，并非一定要以提交代码的方式才算贡献。在一定程度上来说，深度使用 Vue.js 并提供有意义的反馈信息甚至要比提交代码的贡献还大。而社区内也的的确确存在这样的角色，并且 Vue.js 团队也非常欢迎并尊重他们。

社区的强大与否，很大一部分由生态决定。曾有一段时间我专注为 Vue.js 3 的核心做贡献，这也是我有信心完成这本书的最重要原因之一。

Vue.js 的核心将仍然由尤大领导，我本人未来会在 Vue.js 的社区项目建设和探索方向做更多的尝试。正如我给自己立的 2022 年的 flag：

基于这个目标，现在已经有了一些小的成果。为了解析 Vue SFC 中的<style>块，我开发了 Telecss

再来一张图书的照片：

最后，感谢为这本书写推荐序/语的各位大佬，以及所有支持这本书的读者，非常感谢，感恩~

希望我像按约定完成这本书一样，也能在 2022 年底按约定完成这个 flag。同时我也有一些新的想法，希望能够顺带着完成。为 Vue.js 的社区多样性添砖加瓦，大家一起加油！！！

文末福利

小伙伴有什么想跟霍春阳老师交流的，不管是有关 Vue 的设计细节还是你在学习 Vue 的过程中遇到过的那些问题，都可以在评论里说说哦！精选留言 3 位，获得新书《Vue.js设计与实现》。（悄悄告诉你：是珍贵的签名版哦）