首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Vue 3.0 正式进入 Beta,尤雨溪说了这些,开发者们大呼真香

点击上方“蓝字”,轻松关注我们

4 月 21 日,在由前端圈组织发起的 B 站直播中,尤雨溪远程连线,分享了 Vue 3.0 Beta 版本的那些变化。本文是对其分享的简单总结。Vue 3.0 Beta 来了!4 月 17 日,Vue.js 作者尤雨溪宣布 Vue 3.0 正式进入 Beta 阶段。

Beta 阶段的主要进度有:

已合并所有计划内的 RFC;

已实现所有被合并的 RFC;

Vue CLI 通过 vue-cli-plugin-vue-next 提供实验性支持;

提供了一个用于 Vue 3 的最小化 webpack 配置,支持单文件组件。

众所周知,vue3.0在去年开放了源码,并且今年将发出真正的可用于开发的版本。

那么我们今天就带着大家了解下 vue3.0,到底进化了什么,会对我们的开发有什么影响?

自身性能的变动

一、更快

带来更快的改动主要有两方面

1、vue3重新审视了 vdom,更改了自身对于 vdom的对比算法。vdom从之前的每次更新,都进行一次完整遍历对比,改为了切分区块树,来进行动态内容更新。也就是只更新 vdom的绑定了动态数据的部分,把速度提高了6倍;

2、 把 definePerproty改为了 proxy,对于 JavaScript引擎更加友好,响应更加高效。

二、更小

之前 vue的代码,只有一个 vue对象进来,所有的东西都在 vue上,这样的话其实所有你没用到的东西也没有办法扔掉,因为它们全都已经被添加到 vue这个全局对象上了。

vue3的话,一些不是每个应用都需要的功能,我们就做成了按需引入。用 ES module imports按需引入,举例来说,内置组件像 keep-alive、transition,指令的配合的运行时比如 v-model、v-for、帮助函数,各种工具函数。比如 async component、使用 mixins、或者是 memoize都可以做成按需引入。

写法上将发生的变动

一、加强了 typescript的支持,虽然我们在 vue2已经可以使用 typescript了,但是在vue3中,进一步加强了对 typescript的支持,很可能以后你就需要用 typescript来写 vue了;

二、改为使用函数式写法,如果你使用 Function-based API,那如下图所示:

我们可以看到,这里面的变化在于 watch、mounted等等生命周期,从属性变成了方法。除此之外我们可以直接把 watch、onMounted等作为了一个方法从 vue中拿出,如下面代码:

开发这样的做法好处之一,就是让我们可以更好地进行 tree-shaking,从侧面上帮助了我们更小的目标。

那么如果你的技术栈是 vue,我们应该怎么去补全,怎么去应对呢?

推荐阅读

那些程序员喜欢经常溜达的网站

秃头程序员

收藏!程序员需要珍藏的Chrome插件

秃头程序员

(免责声明:图文来自网络,若有侵权,请联系秃头程序员后台删除)

点击在看

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20200427A066GI00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券