Vue 3.0升级

版本换代需要我们花更多的时间适应学习，但升级是为了更好，让你的前端项目更快更好更紧跟前端时代。

一，为何要升级呢？已经如此优秀了？

1. 因为有react优秀在前，如果vue2.0不能跟上这个优秀的框架还固步自封的话，必将没落。

Vue2.0的缺点是他的敌人比他更加优秀。

2.性能比react低。（低在dom渲染上，低在watcher的监听不如react设计得高效）

3.打包文件没有react轻简。

4.对未来必然流行的TS没有react支持得好

二，对比vue2.0的区别

目前，Vue 的反应系统是使用 Object.defineProperty 的 getter 和 setter。 但是，Vue 3 将使用 ES2015 Proxy 作为其观察者机制。 这消除了以前存在的警告，使速度加倍，并节省了一半的内存开销。为了继续支持 IE11，Vue 3 将发布一个支持旧观察者机制和新 Proxy 版本的构建,而为什么使用 Proxy 替代 Object.defineProperty？Proxy 可以劫持整个对象，并返回一个新的对象。Proxy 不仅可以代理对象，还可以代理数组，还可以代理动态增加的属性。节省内存，速度加倍

1.性能更比Vue 2.0强。

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

2.打包更科学不再打包没用到的模块

支持了 tree-shaking （剪枝）：像修剪树叶一样把不需要的东西给修剪掉，使 Vue3 的体积更小。
需要的模块才会打入到包里，优化后的 Vue3.0 的打包体积只有原来的一半（13kb）。哪怕把所有的功能都引入进来也只有23kb，依然比 Vue2.x 更小。像 keep-alive 、 transition 甚至 v-for 等功能都可以按需引入。

3.Composition API（组合API）

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

4.Fragment, Teleport, Suspense

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

5.更友好的支持兼容TS

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

6.Custom Renderer API（自定义渲染API）

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

二，升级的方法可以点击下面的vue 2 和3 的官方文档链接。

1.vue3.x点击地址

Vue 3.x 地址

2.vue2.x点击地址

Vue 2.x 地址

如果官方文档比较难懂，可以先阅读几篇博客，适应下
地址1：如何升级
地址2：快速使用Vue3最新的15个常用API（1W5+字详解，建议收藏）