直接学 Vue 3 吧 —— 对话 Vue.js 作者尤雨溪

Posted 《新程序员》编辑部

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了直接学 Vue 3 吧 —— 对话 Vue.js 作者尤雨溪相关的知识,希望对你有一定的参考价值。

程序员》于 2000 年创刊,其理念为技术改变世界,创新驱动中国。2021 年,《新程序员》
全新起航,首期以「开发者的黄金十年」为主题,以音视频、图文专栏等丰富的多媒体形式为载体,立足当下,放眼未来,为读者带来全方位的技术和产业解读。

本文为《新程序员》第一期内容,在 UNIX 开发者 Brian W. Kernighan 之后,我们采访到 Vue.js
的作者尤雨溪,与其共谈精彩程序人生、共论顶级开源项目的成功之道。

从复杂的 jQuery 插件化开发到模块化及组件化,现代前端技术在迭代的过程中不断推陈出新,派生出大量的模式和工具。Vue.js 作为前端框架中的一匹黑马,从首个 commit 的提交,到破茧重生的 Vue 3、Vite 2,它备受前端从业者的青睐,同时凭借轻量级、简单易学等优势荣登 GitHub Repo TOP 3,且获得了 182k 个 Star,Fork 数达到了 28.6k。

而提及 Vue.js 背后的作者——尤雨溪(Evan You),这位可文可武的开发者、开源爱好者、设计师,想必很多人也并不陌生。今天,《程序员》将与大家一同走近尤雨溪的「开挂」人生,深度分享他在将 Vue 项目打造成为业界主流框架的八年间鲜为人知的心路历程。

尤雨溪:从艺术爱好者到年薪百万的全职开源开发者

尤雨溪,网名尤小右,作为一位「半路出家的程序员」,其实他一开始志并不在编程。

学生时代,对画画特别感兴趣的尤雨溪,在初中时期偶然间推开了 Flash 动画的大门,他将静态的画通过一定的技术方式「动」起来,为自己喜爱的动漫创造出更好的视觉体验,甚至在某次生物课的演示上,他将演讲内容加入了很多科幻效果,而正是这些尝试,也鼓舞了他日后想要坚持走艺术这条路的决心。

后来,高中毕业后,尤雨溪以接近满分的托福成绩考入美国 Colgate University 大学。在大学期间,尤雨溪坚守自己的爱好,选择的专业是室内艺术和艺术史。但是,随着时间的推移,其发现,艺术这条路也并非想象的那么简单,一方面,在不懂编程的情况下,很难凭借简单的 Flash、html 5、CSS 等知识实现自己的想法;另一方面,也和《黑客与画家》里面的格雷厄姆所体验到的现实一样,“我决定不当画家了,首先要彻底解决自己的收入问题”,在美国,这个专业的毕业生很难找到工作。

因此,凭借着自学,尤雨溪在本科毕业的时候做了一个完全靠编程来实现的网站,并用它成功进入了美国纽约的 Parsons 设计学院并获得了 Design & Technology 艺术硕士学位。在此期间,尤雨溪不仅学习了 openFrameworks、动画算法等技术,还接触到了 javascript 编程语言。同时,除了参加日常的课程之外,尤雨溪在业余时间也经常“蜗居”在各大社区中,并在 TJ Hollowaychuck(https://github.com/tj)、Guillermo Rauch(https://github.com/rauchg)、Substack(https://github.com/substack)等活跃于 Node.js 生态初期的开发者影响下,他在 JavaScript 这条路上越走越深,也基于此开启了自己的职业生涯:

  • 2012 年,尤雨溪花费了两天的时间,打造了一款 HTML5 版的 Clear(极简任务管理应用)并将其开源,凭借简单的操作方式且摆脱了任何形式的按钮束缚,该应用在上线短短一天后,便登上了 HackerNews 首页,且受到了 Facebook、Color 等大厂的 Email。
  • 2013 年,尤雨溪加入 Google Creative Lab Five Program 项目组,担任 Creative Technologist,主要负责快速实现可体验的产品原型。在彼时的环境中,前端框架才刚刚崛起,而起步稍早的 AngularJS 应用也更为广泛一些。不过,在日常工作中,尤雨溪发现 AngularJS 在某些应用场景中的表现不如人意,以基于前端框架的双向绑定实现为例,AngularJS 有自己的一套模板编译规则,且需要使用脏检查,对于开发者而言太过繁重且灵活性不够。而为了更好地满足自己的工作需求,尤雨溪决定自己动手开发一个轻量级的框架来练练手。
  • 2014 年 2 月,尤雨溪带着前端开发库——Vue.js 来了,它可以通过简洁的 API 提供高效的数据绑定和灵活的组件系统。同时,尤雨溪选择了开源的方式,方便更多的开发者使用并参与其中。

随着 Vue 用户规模的不断增长,正如文艺复兴时期的代表人物阿尔伯蒂的一句至理名言:“任何一种艺术,不管是否重要,如果你想要在该领域出类拔萃,就必须全身心投入。”在 2016 年,尤雨溪决定以全职开源开发者的身份全身心地投入到 Vue 项目的维护中。

这一路走来,他的技术成长经历成为了很多想要跨行以及专业开发者学习的楷模。不过对于尤雨溪自身而言,他并不希望自己成为程序员的个人崇拜对象,因为在他看来,「做脑力工作的人,往往钻研得越深,越发现自己的渺小和无知」。

尤雨溪认为,「崇拜」和「敬佩」两个词其实非常不同。其表示,“过度的「崇拜」另一个人,往往让人妄自菲薄,觉得自己好像永远也赶不上对方,甚至放弃了赶上对方的努力。但事实上,这世上碾压众生的「怪物」也并没有那么多,大部分有点名气的程序员,可能是因为种种机遇才得以成名,单论技术实力,其实也都在凡人努力可及的范围之内。相比之下,「敬佩」一个人,则心态上更多地会去思考这个人身上有什么东西值得我学习,我如何才能拉近自己和对方之间的距离。”

如今,在尤雨溪全身心投入 5 年、Vue 落地近八年的时间里,Vue 从一个“蹒跚学步”的婴儿成长为一位正在“乘风破浪”的少年,且也取得了 GitHub TOP3 Repo 的优异成绩。对于尤雨溪个人而言,也在摸索中找到了最适合自己的工作与生活节奏。

《程序员》:从最早初接触 JavaScript 到 Vue.js 的研发落地,每个阶段,你通过什么样的方式不断提升自己的技能?

尤雨溪: 多看多尝试!一直呆在舒适区往往就得不到提升,程序员能力的提升往往都发生在尝试解决一个从没解决过的问题之后进行反思的过程中。

《程序员》: 你曾谈到在 Meteor 作为一名开发者没有高层决策能力,这其实是我们常常面对的问题。从 Unix、Linux 等到今天,伟大的项目往往由一个人或者一个极小数量的群体发起并成长起来,而在企业里,项目的开展往往讲求完美的计划、多人头脑风暴,你认为这两者之间是否存在“矛盾”?

尤雨溪: 会有一定的矛盾。决策过程的参与人并不总是越多越好,有时候意见分歧会导致事情反而没法顺利推进。但没有一定数量的互相反馈也很容易忽略一些重要的问题。

个人认为,需要有完善的计划和探讨,但在决策上还是要有一个敢于承担责任并且有能力拍板的人去确保项目不陷入无止境的“扯皮”中。

《程序员》: 从 2013 年提交了第一个 Commit 到今天,Vue.js 已经快 8 岁了,你有着怎样的心路历程?遇到过的最大的难题是什么?

尤雨溪: 时间过得还是很快的,一开始 Vue 只是一个兴趣使然的小项目,现在它是我的全职工作,真的可以说是陪伴着我一步步从初出茅庐到成家立业了。这过程里最大的难题并不是技术问题,而是在 2016 年考虑是否要辞职,全职做开源。当时没有太多可以参考的案例,也没有十足的把握,可以说是完全凭着热情做出了这个决定,不过幸运的是这可能也是我这辈子做得最成功的决定之一。

《程序员》:8 年过去,你认为前端发生了哪些变化,如何看待今天三足鼎立的局面,前端发展的未来走向将是怎样的?除此之外,你还在关注哪些技术?

尤雨溪: 我个人觉得,主要的变化就是前端从相对 “手艺活” 的定位变得更加工程化了,已经有了大量成熟的工具和模式,生产力大大提高。目前在前后端分离的场景下已经没有太多潜力可挖了,所以在生产力和性能方面的探索开始分裂为两个方向:

  • 一个是 JavaScript 全栈,打通前后端数据和类型(比如 React Server Components 以及 Next/Nuxt 这样的全栈框架);
  • 一个是对传统后端更友好,但保留现代前端部分开发优点的方案(比如 Phoenix LiveView、Laravel LiveWire)。

具体来看,JavaScript 语言在 ES2015 大跃进之后慢慢稳定,随着微软停止支持 IE11,我个人希望看到的情况是现代 JavaScript 语言特性的支持能够彻底普及,这样无论是框架还是工具层面都可以少浪费些精力在兼容方面。TypeScript 会越来越普及,类型会成为大部分非玩票前端项目的标配。

另一个崭露头角的趋势就是用非 JavaScript 的语言去写支持前端的工具。自从有了 Node.js,前端工程师们自然而然地用 JavaScript 去写给自己用的工具,但现在我们发现在构建性能这块,JavaScript 依然是完全没法跟 Go 或者 Rust 这样的编译型语言比的。esbuild 和 swc 已经用优于 JS 工具链几十倍甚至上百倍的性能证明了这一点。某种程度上来说,接下来几年非 JavaScript 语言对前端的影响可能更多会体现在工具链方面(相比 WASM 而言)。

《程序员》:对于工程师来说,在最初的 5 年、10 年等不同的职业阶段,什么样的技能或者思维最为重要?

尤雨溪: 不同路线的侧重点是完全不一样的,大公司 vs 创业公司,纯技术岗 vs 管理岗,没法一概而论。尤其是我自己走的是独立路线,需要关注的东西又跟在公司里发展不一样。非要说共通的一点,可能就是想清楚自己擅长什么,想要什么,选一条适合自己的路线吧。

一个人顶起一个项目,Vue 的构建与重写!

如果用一句话总结 Vue 今日的成功,尤雨溪认为,「时机,坚持,基于用户去思考」三者缺一不可。抓住前端发展的浪潮,不断地尝试与改进,从根本上解决开发者日常工作中的痛点,是 Vue 的不断向前的驱动力,而重写 Vue 3 的根源也是在此。

《程序员》:2020 年 9 月,Vue 3.0 正式发布,这一版本为什么要重头开始写?亦或说重构之后的 Vue 3 解决了此前哪些必须解决的问题?

尤雨溪: 重写的主要原因一个是类型系统,一个是内部逻辑分层。Vue 2 项目先基于 JavaScript,中期加入了 Flow 做类型检查,导致类型覆盖不完整。Flow 本身又破坏性更新频繁,工具链支持也不理想,所以决定转为用 TypeScript 重写。Vue 2 的内部逻辑分层不够清晰,对于长期维护是一个负担,这也是一个不重写就很难彻底改善的问题。

《程序员》:这样的一个大型开源项目重写,必定耗费了不少心血,此次的重写主要是你一个人完成的吗?在 Vue 团队中,全职开发者有几位?

尤雨溪: 这个项目初期主要是我一个人,但进入了 Alpha 以后也有很多来自外部贡献者的 PR。团队全职的严格来说其实只有两位,一个是我,一个是 @soda 负责 Vue CLI 的维护。

其他成员一部分有自己的全职工作,仅用业余时间参与,但现在也有好几位是自由职业者,通过 GitHub 或其他渠道的赞助,贡献部分时间参与 Vue 的开发。

《程序员》:重写的过程中,你认为最难的挑战是什么?是否遇到过比较有挫败感的事情?又是如何解决的?

尤雨溪: 最难的是如何在尽可能兼容 Vue 2.x API 的前提下改善内部架构和性能,同时还要开拓新的能力。比如 Composition API 在刚提出的时候遇到了很大的阻力,但后续根据用户反馈调整,现在在高级用户中的接受度还是很高的,算是达成了设计的目的。

《程序员》:Vue 3 版本兼容 2.x,对于想要学习 Vue 的开发者而言,时常在纠结是从 Vue 2 开始学基础还是直接学 Vue 3,对此,你有着什么样的建议?

尤雨溪: 直接学 Vue 3 就行了,基础概念是一模一样的。

《程序员》:Vite 2 不久前正式发布,未来 Vite 会不会慢慢地取代掉 webpack?

尤雨溪: 完全取代应该不可能,这也并不是目标。webpack 有巨大的存量,功能上也覆盖了一些 Vite 并不打算覆盖的场景(如 Module Federation),但对于大部分应用,尤其是中小型应用来说,webpack 的复杂度和性能代价其实并无必要。

《程序员》:今天,Vue.js 有着非常多的跨时区、跨文化的协作,你采用了哪些方式确保代码质量和高效协作?

尤雨溪: 其实开源协作未必高效,毕竟大部分成员都不是全职。但好处是因为不是有业务压力的公司,所以高效并不是一个必须的条件。我们团队会每两周开一次例会同步一些进展,进行一些讨论,除此之外几乎都通过 GitHub 协作。

尤雨溪的开源思考与 Vue 的开源路径

在开源吞噬世界的今天,尤雨溪对「开源」也有自己独特的理解。

《程序员》:很多开源开发者希望将项目商业化,但很少有开发者能赚到钱,你认为问题出在哪里?

尤雨溪: 根本原因是做好一个开源项目跟做好一个商业项目本质上需要不同的技能树。同时在这两个技能树都具备足够能力的人其实并不多(或者说很多开发者没有意识到自己需要在商业技能树这一块做更多的投入)。

《程序员》:许多成功的开源项目的背后往往都有一个进行商业化的公司。你之前曾分享过成立 Vue Technology LLC 公司只是出于税务/签证的需求,2018 年时看到你在招全职开源开发者,现在对于公司的规划是怎样的?

尤雨溪: 我个人一直秉持 “Lifestyle Entrepreneurship” 的理念,并不打算做一个追求规模和利润的纯商业化公司,而是希望能够保持 “赚足够多的钱,做想做的事” 这样的状态。当然这也不排除适当地扩展一下规模,毕竟现在 Vue 的生态也变得更大了。

《程序员》:你如何看待「开源」的发展及它对世界的影响?未来开源还会向哪些方向发展?在这一进程中开发者尤其是中国开发者,有哪些令你期待之处?

尤雨溪: 其实如今开源软件也已经分化出了很多不同的形态,基于基金会的跨公司合作项目、完全隶属于一个公司的开源、个人开发者或小团队的开源,这些不同项目之间的开发动机和运作模式都有很大的差别。我个人很期待看到更多个人开发者可以通过开源软件养活自己,但这需要独立开源项目的经济生态有进一步的改善。开源有一个好处就是只要项目技术过硬,就可以跨越文化和语言的隔阂。希望能看到更多来自中国的开源项目站上世界的舞台。

One More Thing

《程序员》:你当前正在忙于何事?对于 Vue 有什么新计划?

尤雨溪: 过去几个月主要聚焦于 Vite 2.0 工作方面,现在将重心转回 Vue 这边了。现阶段 Vue 的重点还是 2.x 到 3.x 的过渡,当前对于 Vue 3.1 已经积累不少想法,下半年会有更具体的计划。

《程序员》:你现在的一天是如何度过的?

尤雨溪: 近一年由于疫情的原因,很少出门。就作息而言,可以称得上非常规律。

工作方面,每天的内容都不一样,有时候会专注于处理 GitHub issue,有时候会专注于新功能的开发。事情一直很多,但好处是基本上可以自己决定要优先处理什么。

除了面对电脑进行工作,空闲的时间就是在陪孩子。偶尔玩玩游戏,也会适当地运动,如打篮球。

从 Unix 开发者 Brian W. Kernighan、OpenCV 创始人 Gary Bradski,到 Vue.js
作者尤雨溪……《新程序员》第一期以「开发者的黄金十年」为主题,与多位国内外知名的技术引领者和新锐创新者进行了深度对话,希望为中国开发者打开新时代的「机遇之窗」。

《新程序员·开发者黄金十年》正式发布

由近百位专家参与、经数月打磨后,《新程序员001:开发者黄金十年》面向所有开发者正式官宣发布!不仅包含了开发者们一如既往期待与喜爱的全球技术大师深邃思考、优秀开发者技术创造等深度内容,更以数字多媒体的新形态让开发者们随时随地阅读、观看,带来视频图文的多重体验。

用一位开发者和我们说的话来表达:“当年的那个《程序员》回来了!”

当年的那个《程序员》不仅回来了,而且洋溢着新的活力。
加入新程序员读者俱乐部:

移动端的同学也可以扫码下方二维码加入

以上是关于直接学 Vue 3 吧 —— 对话 Vue.js 作者尤雨溪的主要内容,如果未能解决你的问题,请参考以下文章

如何利用HBuilderX软件开发vue.js

前端学完vue学啥

Hi,一起学Vue.js吗

vue.js——安装

cmd输入vue弹出一个对话框让我打开vue.js是怎么回事?

vue路由