Hi,这里是JustHappy,在看过许多面经和听过许多身边朋友的面试过程后,发现有些面试官会问诸如此类:“Vue3为什么快?”,“Vue3快在哪里?”,“Vue3一定比Vue2好吗?”。然后入职后发现公司用的是Vue2🤓🤓🤓,所以这该怎么回答呢?为什么目前还有很多公司在用Vue2呢?为什么我们要学习Vue3的源码而不是Vue2的?希望我能用一篇文章给您讲好,也希望这篇文章可以对您有所帮助。
此篇为新专栏的开端,各位客官的点赞、收藏、评论和关注,都是我更新的动力哦😍
Vue3为什么快?快在哪里?👋👋
其实这是一个比较宽泛的问题,因为Vue3相比Vue2快在不只一个方面🤓,以下是我整理的一些,包含了个人理解
代码编写快: Composition API 🆚 Options API
舒适的编写体验 😌😌
如果你编写过Vue3,肯定会被Composition API所折服,特别是在学习完Vue2之后,用Vue2写了几个项目什么的,上手Composititon API就会有种挣脱束缚的感觉,至少你的手臂不用在键盘和鼠标之间来回移动,无论是写代码还是看代码的时候,同时,你的编程思路也会更加集中,不会在频繁的切换中丢失灵感,上面这幅图就很好展现了这一点。
良好的代码复用性 🔖
在写Vue2的Options API时候,很多时候会感觉是人要主动去适应那个格式,在代码进行复用的时候也要考虑的更多,修改的更多,而Composition API下很多时候直接CV就OK
同时更加接近原生JavaScript的Composition API风格也赋予了Vue3更多的可能性,总的来说,就是让咱或咱们(个人或团队)的代码编写速度更快
更方便的:Tree shaking🌲
Tree shaking 译为 「树摇动」
在前端领域Tree shaking这个概念最早是因为rullup.js而普及的,其原理就是排除代码中的dead code,也就是消除那些永远不会被执行的代码,就像上面这个图一样,这个过程就像在摇动一个果树,坏掉的果实(deadcode)就会被摇下来,这样留在树上的就是好的果实了,Vue3调整了项目结构,使得其更便于进行Tree shaking。
响应快:更快、更好的响应式实现 🚀
学习过Vue源码的朋友应该都知道,Vue3重构了响应式系统的实现,使用Proxy代替Object.defineProperty,也就是reactive和ref,这不只使得Vue3可以监听到数组类型、对象类型的数据变化,还大大提升了响应式系统的性能,在这点,以后我会再写一篇文章,详细说说Vue3的响应式实现
Vue3一定比Vue2好吗?🤔🤔
这个问题是比较绝对的,相信接受过应试教育的都知道,绝对的选项大概率是错误的🙅,事实也是如此,尽管Vue2已经停止更新,但是目前很多公司的项目还是Vue2的技术栈,一方面是项目升级是有成本和风险的,一方面由于Vue2从2016年就正式发布了,相比与Vue3,Vue2的生态更加稳定并且在网络上有更多的经过时间验证的技术解决方案,所以很多公司非必要不会升级Vue3,Vue3也并不一定比Vue2“好”