vue3 vs vue2(响应式原理)

1. vue2是通过数据劫持+发布订阅者模式去实现响应式的，是对data中的每个属性进行了递归遍历，为每个属性设置getter和setter。而vue3是对一个对象进行监听，只要对象发生变化就被监听到，这就完全可以代理所有属性。
2. vue2中需要递归遍历对象中的所有属性， 如果一个对象中属性特别多或者是嵌套很深的话，会非常消耗性能。但vue3是在getter中递归，也就是只有真正被访问到的属性才会变成响应式，减少了性能消耗。

• vue2响应式原理 对象： data通过observer把每个属性转换成了getter和setter的形式去追踪变化，当watcher实例读取属性时，会触发getter，从而被添加到依赖收集列表dep中，当属性发生变化的时候会触发setter,通知dep列表中所有watcher执行更新函数，从而更新视图。 vue2不能侦测到对象属性的新增和删除

数组：也是在getter中进行依赖收集，不同的是，数组的响应性是用方法拦截器让数组变得可观测。 vue2直接通过索引修改数组元素或者直接修改数组长度，这是不能被侦测到的。

• vue3响应式原理 主要是在proxy的第二个参数handler中，track函数用来收集依赖，trigger函数用来触发更新。