1. Vue 3.0 性能提升主要是通过哪几方面体现的？
- diff 算法优化 新旧节点对比不在是全部重根节点开始，而是重上一次静态节点开始对比，直接复用静态节点
- 事件监听缓存
- SSR 优化 当静态内容大到一定量级时候，会用 createStaticVNode 方法在客户端去生成一个 static node，这些静态 node，会被直接 innerHtml，就不需要创建对象，然后根据对象渲染
- 源码体积 V3 移除了不常用的 API Tree shaking
- 重写数据响应拦截 V2 中用 Object.defineProperty 来劫持对象，监听所有属性，需要深度遍历所有属性，并给每个属性加上 setter 和 getter; V3 中采用了 Proxy 可以监听整个对象，不需要深度遍历
- 可以监听属性的添加
- 数组的索引及长度
- 属性的删除
- 用 ts 重写 支持 ts
2. Vue 3.0 所采用的 Composition Api 与 Vue 2.x 使用的 Options Api 有什么区别？
- 逻辑组织 Options API ，即以 vue 为后缀的文件，通过定义 methods，computed，watch，data 等属性与方法，共同处理页面逻辑 当组件变得复杂，导致对应属性的列表也会增长，这可能会导致组件难以阅读和理解 而 Compositon API 正是解决上述问题，将某个逻辑关注点相关的代码全都放在一个函数里，这样当需要修改一个功能时，就不再需要在文件中跳来跳去
- 逻辑复用
在 Vue2 中，我们是用过 mixin 去复用相同的逻辑
使用单个 mixin 似乎问题不大，但是当我们一个组件混入大量不同的 mixins 的时候 会存在两个非常明显的问题：
- 命名冲突
- 数据来源不清晰
3. Proxy 相对于 Object.defineProperty 有哪些优点？
V2 中用 Object.defineProperty 来劫持对象，监听所有属性，需要深度遍历所有属性，并给每个属性加上 setter 和 getter;
V3 中采用了 Proxy 可以监听整个对象，不需要深度遍历
- 可以监听属性的添加
- 数组的索引及长度
- 属性的删除
4. Vue 3.0 在编译方面有哪些优化？
- diff 算法优化 新旧节点对比不在是全部重根节点开始，而是重上一次静态节点开始对比，直接复用静态节点
- 事件监听缓存
- SSR 优化 当静态内容大到一定量级时候，会用 createStaticVNode 方法在客户端去生成一个 static node，这些静态 node，会被直接 innerHtml，就不需要创建对象，然后根据对象渲染
5. Vue.js 3.0 响应式系统的实现原理？
Vue3 使用 Proxy 对象重写响应式系统，这个系统主要有以下几个函数来组合完成的： 1、reactive: 接收一个参数，判断这参数是否是对象。不是对象则直接返回这个参数，不做响应式处理 创建拦截器对象 handler, 设置 get/set/deleteProperty get 收集依赖（track） 返回当前 key 的值。 如果当前 key 的值是对象，则为当前 key 的对象创建拦截器 handler, 设置 get/set/deleteProperty 如果当前的 key 的值不是对象，则返回当前 key 的值 set 设置的新值和老值不相等时，更新为新值，并触发更新（trigger） deleteProperty 当前对象有这个 key 的时候，删除这个 key 并触发更新（trigger） 返回 Proxy 对象 2、effect: 接收一个函数作为参数。作用是：访问响应式对象属性时去收集依赖 3、track: 接收两个参数：target 和 key 如果没有 activeEffect，则说明没有创建 effect 依赖 如果有 activeEffect，则去判断 WeakMap 集合中是否有 target 属性， WeakMap 集合中没有 target 属性，则 set(target, (depsMap = new Map())) WeakMap 集合中有 target 属性，则判断 target 属性的 map 值的 depsMap 中是否有 key 属性 depsMap 中没有 key 属性，则 set(key, (dep = new Set()))
