vue3.0前言

Vue 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。

通过脚手架vite安装

1	npm init vite-app hello-vue3 # OR yarn create vite-app hello-vue3

Vite目前仅支持 Vue 3.x以上，这意味着你不能使用不兼容Vue 3的组件库

目前基于Vue的第三方组件库兼容Vue 3的情况：

Ant Design Vue：支持 Vue 3.0 的 2.0.0 测试版已发布

ElementUI：尚未支持

MintUI：尚未支持

iView(ViewUI)：尚未支持

Vue2-leaflet：很明显不支持

通过脚手架vue-cli安装

首先全局更新最新版的 Vue CLI，4.5.0以上版本支持 Vue3：

1 2	npm install -g @vue/cli # OR yarn global add @vue/cli vue create hello-vue3

当前最小化并被压缩的 Vue 运行时大小约为 20kB（2.6.10 版为 22.8kB）。Vue 3.0 捆绑包的大小大约会减少一半，即只有 10kB！

Object.defineProperty 是一个相对比较昂贵的操作，因为它直接操作对象的属性，颗粒度比较小。将它替换为 es6 的 Proxy，在目标对象之上架了一层拦截，代理的是对象而不是对象的属性。这样可以将原本对对象属性的操作变为对整个对象的操作，颗粒度变大。

javascript 引擎在解析的时候希望对象的结构越稳定越好，如果对象一直在变，可优化性降低，proxy 不需要对原始对象做太多操作。

vdom 的本质是一个抽象层，用 javascript 描述界面渲染成什么样子。react 用 jsx，没办法检测出可以优化的动态代码，所以做时间分片，vue 中足够快的话可以不用时间分片。

vue 的特点是底层为 Virtual DOM，上层包含有大量静态信息的模版。为了兼容手写 render function，最大化利用模版静态信息，vue3.0 采用了动静结合的解决方案，将 vdom 的操作颗粒度变小，每次触发更新不再以组件为单位进行遍历，主要更改如下

vue3.0 将 vdom 更新性能由与模版整体大小相关提升为与动态内容的数量相关