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