内部优化
1.vue2与vue3双向数据绑定原理不同
2.静态变量提升
3.pathFlag 标记
4.缓存事件处理函数
写法优化
1.vue3碎片化，可写多个根节点
2.api 不同 选项型 vue2: opsition api 组合型 vue3: composition api
3.数据存储方式不同 vue2:data vue:ref reactive
1.vue2与vue3双向数据绑定原理不同
vue2 是利用es5的object.defineProperty对数据进行劫持结合发布订阅模式实现的
vue3是利用es6的proxy API 对数据进行的一个代理
细分
- diff 算法优化，新增PatchFlag标记 只比较带有静态标记的节点
2.静态提升 vue3中对于不参与更新的元素会做静态提升，只会创建一次，在渲染的时候复用即可
3.事件监听缓存 默认情况下会给函数打一个静态标记 patchflag:8，表明这是个函数，会进行缓存
2.vue3支持碎片
就是在组件中可以放置多个根节点
3.vue3中采用composition API
vue2:采用的选项型API(opsition API)
vue3:采用的合成型API(composition API
4.建立的数据方式不同
vue2:数据是放置在data属性中
vue3:需要使用setup 方法，该方法在初始化构造的时候触发
注：ref:需要value 访问，内部还是使用的defineProperty set get 方法进行监听（proxy 不支持基本类型的监听）
reactive: 使用的proxy对数据进行的一个代理
5.声明周期函数不同
vue2:
beforeCreate （初始化前）
created （初始化完成）
beforeMount（挂载前）
mounted （挂载完成）
beforeUpdate （更新前）
updated （更新完成）
beforeDestory （销毁前）
distoryed（销毁完成）
activeted(页面缓存执行)
deactiveted(页面缓存)
vue3:
setup();
onBeforeCreate （初始化前）
onCreated （初始化完成）
onBeforeMount（挂载前）
onBMounted （挂载完成）
onBeforeUpdate （更新前）
onUpdated （更新完成）
onBeforeUnmount （销毁前）
onUnmount（销毁完成）
onActiveted(页面缓存执行)
onDeactiveted(页面缓存)
