vue3.0 带来的新变化

Vue.js 3.0 没有沿用 Vue.js 2.x 版本的代码,而是从头重写了,代码采用了TypeScript 进行编写,新版的API全部采用普通函数,在编写代码时享受完整的类型推断。

Vue3.0 具有以下8个亮点。

1. 更好的性能

Vue3 重写了 虚拟DOM的实现,并对模板的编译进行了优化,改进了组件初始化的速度,相比Vue2.x ,更新速度和内存占用方面都有显著的性能提升。

2. Tree-shaking 支持

对无用的模板进行了“剪枝” 仅打包需要的,减少了产品发布版本的大小。Vue3 支持按需引入,而在vue2中,既使用不到的功能也能打包进来。

3. 组合API(composition API)

Vue 2.x 使用mixin来复用功能,单mixin存在的问题是:如果勇夺了,则很难知道某个功能是哪个mixin混入的。此外,mixin的类型推断也很差,Vue3.0新增的composition API 可以完美地替代mixin,让用户可以更灵活且无副作用地复用代码,且 Compostion API可以很好的进行类型推算,compostion API 解决了多组件见逻辑重复的问题。

4.碎片(Fragmem)

Vue 2.x 的组件库需要有一个唯一的根节点,而在Vue3.0中,这成了历史,组件模板不再需要单个的根节点了,可以有多个节点。

5 传送(Teleport)

有时组件模板的一部分在逻辑上属于该组件,而从技术角度来看,最好将模板的这一部分移动到DOM中,Vue应用程序之外的其它位置,使用Teleport 内置组件可以很容易地实现这个需求。

6 悬念(suspense)

Suspense 内置组件可以在嵌套层级中等待嵌套的异步依赖项,支持 async setup() 支持异步组件。

7 更好的TypeScript 支持

Vue3.0 的代码库完全采用ts编写,具有更好的类型支持,前端开发人员现在可以采用 ts开发vue的应用,而无需担心兼容性的问题,结合支持的vue3的ts插件,开发更加高效,并可以拥有类型检查,自动补全等功能。

8 自定义渲染器 API

使用自定义渲染器API,用户可以尝试与第三方库集成,如编写webGL自定义渲染器,需要注意的是,Vue3.x 目前并不支持IE11

上一篇:Mixin


下一篇:sass补充(2019-3-9)