Vue3特性

2020-08-26 本文已影响0人皇甫贝

2020是一个不平凡的一年；小时候，哭是我们解决问题的绝招；长大后，笑是我们面对残酷现实的武器。
所有产业的大环境都不好的今天，我们更需要充实自己，争取不让自己被残酷现实所淘汰，共勉

Vue3.0简介

7月18日，尤大大公布了VUE 3 RFC的发布
RFC即预发布版。这意味着 Vue3 内核的 API 和实现已到稳定状态，在最终版本发布前，不会提出新功能或者做重大更改。但是还不推荐在项目中使用；千呼万唤始出来，未来可期～

现在Vue团队已经推出vue-composition-api和vue-function-api的RFC

Vue3.0新特性

1.性能

1.1双向响应原理由Object.defineProperty改为基于ES6的Proxy，使其颗粒度更大，速度更快，且消除了之前存在的警告；
1.2重写了 Vdom ，突破了 Vdom 的性能瓶颈
1.3进行了模板编译的优化
1.4进行了更加高效的组件初始化

2.Tree-Shaking 的支持

支持tree-shaking（剪枝）：像修剪树叶一样把不需要的东西给修剪掉，使 Vue3 的体积更小（13kb）。也可以理解成按需打包，全部功能打包也只有23KB

3.CompositionAPI

composition-api 是一个 Vue3 中新增的功能，灵感来自于 React Hooks ，是比 mixin 更强大的存在。
composition-api 可以提高代码逻辑的可复用性，从而实现与模板的无关性；同时使代码的可压缩性更强。另外，把 Reactivity 模块独立开来，意味着 Vue3.0 的响应式模块可以与其他框架相组合。

Options API PK Composition API
CompositionAPI 对复杂组件逻辑进行优化，显的更加紧凑，并且将公共组件进行抽离封装

4.Fragments

不再限制 template 只有一个根节点。
render函数也可以返回数组了，有点像 React.Fragments

5.Better TypeScript Support

更好的类型推导，使得 Vue3 把 TypeScript 支持得非常好

6.Custom Renderer API

实现用DOM的方式进行 WebGL 编程