Vue、Vite核心成员Anthony|Vue、Vite核心成员Anthony Fu访谈(下)
2021年10月28日,Vueshenzhen邀请了Anthony Fu,Vue和Vite的核心成员来了一次访谈,内容涉及Vue、Vite、Nuxt等开源内容,本次访谈分为上下两期,希望大家收藏以后慢慢阅读哟~关于Vue 3 主持人: Vue到3.2之后还会更新吗?还会有哪些新的特性?
Anthony:现在我们整个团队就是专注在重新做那个文档上,把整个文档结构重新调整,可以理解成有点像类似react最近在做的事情,我们把整个文档的顺序重新翻新了,以往我们可能会先教怎么用CDN开始,用Vue X,现在可能大家就是已经默认用构建工具了,那我们就说一个是options API ,composition API组合式API,这两个不同的东西,大家有时候也会有我不知道选哪个的问题。那么在之后新的文档里面,我们会把这两个API平等对待,也就是你可以选你喜欢哪一个API,你所有的文档都会根据你的选择去变动改动,就是你看同样一个页面,你可以选择看options API来讲。除了文档的这个部分,3.3的话主要会专注在那个SSR上,就是服务器渲染,然后那个suspense这个东西会稳定下来,我们可能会去探索一些那个partial hydration就是部分水合,你网页内容静态的东西,我就直接HTML给你了,我就不再重复一份js文档,然后我就只有你动态的那些部分会给你,那这个东西就是还敬请期待吧。
主持人: 好,这个Vue3的新特性的话,我们还是非常期待的,那除了Vue3,还有vue2 ,因为之前也提出来说2.7之后我们可能就不会再发新的版本了,那现在这一块有变动吗?
Anthony:现在计划是2.7一定会是最后一个marjor版本,就是最后一个功能更新。那么2.7之后呢,它不是不更新不维护,还是会发patch,如果有什么任何安全性的问题或者是有什么bug我们还是会修的。我们既然发了3.0之后,那么我们有新的整个codebase,我们一定会更多专注在3.0上。可能3.2之后引入的新的API可能就不一定会再搬回到vue2了,但是我们还有社区,其实你像composition API在Vue 2上一开始也是个社区的插件,如果你真的特别需要Vue 2的话那你还是可以用的,毕竟vue2已经在这里这么多年了,大家都已经用了这么久了,其实整体来说不会有什么大问题。
主持人: 那刚才提到了composition API,那 composition API这一方面有什么新的更新计划吗?
Anthony: 目前没有,因为我们在3.2时候就已经对composition API做了很多性能上的优化,引入了几个新的API让整体conditions变得更加灵活一点。可能就是那个ref sugar,大家其实炒的蛮多的就是那个ref sugar,现在还在RFC中,我们还是继续在看说社区的反馈怎么样,那现在已经有一个新的proposal感兴趣的话可以去看一下。
主持人: 关于composition API有一个问题就是说之前也提到了composition API会集成到vue2.几的版本里面去,这个的计划是什么样子的?
【Vue、Vite核心成员Anthony|Vue、Vite核心成员Anthony Fu访谈(下)】Anthony: 只能说可能还要再等一等,因为我们可能还是要先把文档这部分先做完,才会去考虑2.7的更新,整个2.7如果说要去做的话,还是有一定的工程量的,我们要把整个代码库用ts重写,我们已经有一个pr在那边了,整体来说还是需要去做很多的测试之类的,其实现在这个composition API Vue2的插件已经非常多人在用了,基本上已经是一个趋近于稳定的版本, 其实你用的插件大部分情况应该都可以满足你的要求。
关于Vite 主持人:vite的最新进展可以分享一下吗?
Anthony: vite的话,我们现在大概是一个星期发一个版本,每个星期一还是星期二会发一个新的版本,然后可能每隔两到三个星期会发一个发一个minor,就是发一个功能版本,上一次的功能版本我们整体优化了这个request的,我们以前是所有的request都从服务器这边请求过来,那么我要等服务器请求,我就给你trans这个模块,我们只做这个模块发给服务器之后,再等服务器发另外一个请求过来,我们再做另外一个模块。但其实,我们就可以说我们已经知道这个模块数的关系了之后我们可以直接把整个数,除了动态的节点,我们可以直接把整个树全部都先transform过一遍,我们先直接把cpu密集的东西全部都算掉,之后等浏览器来的时候,我们就已经准备好了,就直接上去了,那这算是对一开始启动的时候有个更快的优化,然后再来就是我们用了esbuild去做CSS的minify,也比原本的快了大概40%,我们现在准备Vue2.7,Vue2.7的话主要是一个安全性的功能更新,我们在很早之前就已经做了一个flag,因为vite它会把你本地文件给暴露在那个网页里面,暴露在这个网页端口里,以前的话你开了服务器之后,只要它能够连上你的服务器,它其实可以看到你整个电脑里面所有的文件,只要它知道路径的话,然后我们后来是加了一个flag,你可以把这个东西关掉,这个东西其实是蛮复杂的,你要怎么知道哪些东西是可以访问,哪些东西不能访问?那我们其实做了很多比较智能化、人性化的东西,希望大家可以开箱即用,同时也不会面临这种风险,之前一直作为一个实验性的功能这个开关默认是关掉的,在2.7里面我们会把它开起来,也就是说从2.7开始就是默认是安全的,之后可能还会再遇到一些问题,那到时候我们再继续处理。
主持人: 那我们也非常期待vite继续的更新,vite确实为何非常的快。那vite未来还有一些其他的打算吗?
Anthony:现在其实在打包的时候,还是蛮大程度上依赖rollup的能力,那依赖rollup的话就是还是没有那么快,那我们要等待esbuild这边的许多功能,比如说什么code splitting现在还没有做的特别完善,等esbuild跟上之后,我们会考虑引入更多的esbuild去优化,让整体的体验变得更快。
其他 主持人: 还有其他的几个问题,第一个是关于Nuxt的,因为你刚刚说已经入职Nuxtlab,那Nuxt3这块有什么新的特性吗?
Anthony: Nuxt3其实还挺多的,我就稍微讲一讲, Nuxt3现在同时支持vite跟webpack引擎,你可以自己选,我们现在准备让整个社区Nuxt3 的模块可以去支持两个不同的引擎,再一个是我们引入了一个新的这个叫bundle的引擎,叫做Nitro,Nitro就是你服务器打包出来的这个产物,它是可以兼容这个edge rendering就是端渲染,我不知道国内怎么翻译,它是不依赖于node,你可以把它部署在你的离用户最近的CDN节点然后去节省整个服务器的性能的损耗,然后也可以让你的应用变得更快之类的。
然后,我们引入了很多开发者体验上的的优化,比如说像之前那个async data,现在已经支持composition API了,你可以随便在哪里都可以调用它,你不需要一定要在patch下面的option API根组件上才能用,你现在在哪里都可以调用,再一个就是有API 的自动引入,组件的自动引入,就是你放组件在components这个目录下,它就会自动帮你引入到Vue里面,你放几个js文件在那个composables下面,然后你去esport一些你可能自己做的一些Vue3的钩子,这些东西也会自动引入。
主持人:Nuxt3现在正式版发布了吗?
Anthony:Nuxt3前两个礼拜发了beta公开我们开源了,正式版还要再等待一段时间,与之同时我们还发了一个叫做Nuxt bridge,那这个bridge的意思就是桥梁,建立Nuxt2和Nuxt3的桥梁,也就是说Nuxt bridge是面向nuxt2的模块,它基本上把Nuxt3的很多功能都搬回到那个Nuxt2上,也就是说包括你可以用composition API,其实我们底层就是用这个composition API这个插件提供的这个能力,然后你拥有刚刚我讲到的这个Nuxt3的各种各样的功能,你也有这个Nitro的这个新的引擎,你也可以用script setup,以前本来是Vue 2不行的,你现在也可以用,就是各种各样的功能。如果你在用Nuxt2的APP的话,那你可以考虑下我们先牵引到bridge,他还是用原本的webpack4,还是用Vue 2,但是你可以有新的功能,同时你可以尽量去贴近Vue 3的这些新的特性,之后你准备好了那你就可以直接换成Nuxt3,就是中间多了一个过渡的过程,可以让你更好的做迁移。
主持人: 那这里我想插问一个问题,就是因为你后续会到Nuxtlab工作,那你去那边工作后有什么新的打算吗?
Anthony: 其实我现在已经在那边工作两个月了,但是这个工作我是remote的、远程的,跟之前做开源有点类似,然后包括我现在做的Nuxt相关的东西也是开源的,只是说一个是你自己想做的东西,一个是公司要分配给你一些任务,差不多是这样的区别。
主持人: 那会影响你在开源社区的参与吗?Vue社区其实你还是member还是比较活跃的,Vite社区你也在参与。
Anthony:整体来说公司还是特别的开放,我在Vue生态系统做的东西其实对Nuxt也有帮助,那它其实也是让我自己花一些时间在做,去探索一些我自己开源上的东西,像其实很多东西也是我一开始写Vite的插件,然后他们觉得不错那我就搬到Nuxt3里面去,差不多是这样子,整体来说就还是互帮互助的感觉。
主持人: 最后一个问题是关于slidev,这个是一个markdown写PPT的对吧?有人问他的原理是什么?
Anthony:原理是什么,这个太general,简单来说就是他的底层是一个被包装过的beat服务器,上层我去做了一些插件的封装,比如说我把所有的每一个幻灯片,就是每一个幻灯片我都写在同一个Markdown里面,然后用三个杠去做区隔,那这时候我就需要写一个Vite的插件,去把这个文件拆开来,变成几个小小的文件再把它们用Markdown渲染成Vue的组件,再把他们丢到前端上,差不多就是这样的一个流程。然后,就是加了对开发者比较友好的东西,比如说代码高亮,那我们就可以直接用我们现有的这些前端,所有的这些现有代码高亮的这些技术,行的高亮,就是你有10行的代码,我可以选择说我现在先亮第一行,第一行怎么样,再调个空格,它可以跑到三到五行亮起来,你可以指引你的读者去看你现在在讲哪一段的代码之类的,我们还集成Monaco Editor你可以直接在里面写代码,你可以直接做live coding,有typescript的支持,相当于它是一个整个用web的技术去做的一套类似PPT的东西,但是比较专注于面向已经对web、对程序工作原理有一定基础的人,其实就是给程序员用的,就是为程序员打造,我其实也不想说做的那么什么low code之类的,因为我自己就是为了我当时准备talk的时候,我自己遇到了一些我觉得什么PPT和那个keynote都有点难用,所以我就后来自己写了一个。
主持人:我这边问完了所有提前收集的问题, Anthony也给我们详细的解答了,非常感谢Anthony陪我们进行了这次漫长的在线对话。
Anthony:谢谢你们邀请我来分享,希望对大家有一些帮助。
大家可以结合视频一起享用哟~VUE SHENZHEN Meetup--Anthony Fu 线上访谈:LINK
推荐阅读
- 一个人的碎碎念
- 野营记-第五章|野营记-第五章 讨伐梦魇兽
- Shell-Bash变量与运算符
- 清明,是追思、是传承、是感恩。
- 牛人进化+|牛人进化+ 按自己的意愿过一生
- vue-cli|vue-cli 3.x vue.config.js 配置
- 七老修复好敏感、角质层薄、红血丝
- 华为旁!大社区、地铁新盘,佳兆业城市广场五期!
- 2020-04-07vue中Axios的封装和API接口的管理
- 标签、语法规范、内联框架、超链接、CSS的编写位置、CSS语法、开发工具、块和内联、常用选择器、后代元素选择器、伪类、伪元素。