✊不积跬步，无以至千里；不积小流，无以成江海

Vue 3 为什么使用 Proxy？

1. 弥补 Object.defineProperty 的两个不足

   a. 动态创建的 data 属性需要用 Vue.set 来赋值，Vue 3 用了 Proxy 就不需要了

   比如，一个数据一开始不在data里面，后来放在了data里面，vue其实是不知道的，只能通过vue.set赋值。但proxy其实代理了这个对象，你对这个对象的所有变更它都能知道，所以改进了这一点。

b. 基于性能考虑， Vue 3 用了 Proxy 就不需要了Vue 2 篡改了数组的 7 个 API

文档里有提到vue2变更的7个API，比如push/pop等，是为了在vue中能让数组变更的特别快，但proxy改进了这一点。

2. defineProperty 需要提前递归地遍历 data 做到响应式，而 Proxy 可以在真正用到深层数据的时候再做响应式（惰性）。

这个遍历在我创建这个组件时就要完成，即提前遍历。但proxy在用到时才会遍历。

Vue 3 为什么使用 Composition API？

Composition API 比 mixins、高阶组件、extends、Renderless Components 等更好，原因有三：

a. 模版中的数据来源不清晰。比如同时用两个mixins，完全不知道它来自于哪里，只能靠猜。

b. 命名空间冲突。如果两个mixins都提供了同样的方法名，我用哪个更合适呢？

c. 性能。

2. 更适合 TypeScript

Vue 3 对比 Vue 2 做了哪些改动？

1. createApp() 代替了 new Vue()

2. v-model 代替了以前的 v-model 和 .sync （新的v-model后面可以接上一个name）

3. 根元素可以有不止一个元素了 （可以在templete里面写两个标签）

4. 新增 Teleport 传送门

5. destroyed 被改名为 unmounted 了（beforedestroyed 当然也改了，变成了beforeunmounted）

6. ref 属性支持函数了 之前是div ref=xxx，现在支持函数后可以支持数组的引用