Proxy相比Object.defineProperty到底好在哪？

核心要义

什么是响应式？
无论是Vue2还是Vue3，都是将响应式数据的取值和赋值变为函数，然后调用这个响应式数据的时候触发对应的getter和setter方法来触发更新。

性能

在ES6之前，Vue2为了实现响应式只有Object.defineProperty这个方法，而到了ES6之后，就可以使用Proxy代替。
众所周知，在Vue2的组件模板中，有一个data方法，我们通常会在这个方法中返回我们在这个组件中需要使用到的变量，使用Object.defineProperty这个方法的话是对data中的每一个属性创建一个监听，但data存在多层的现象，所以就只能深度遍历data中的每一个属性做一个监听，这样的一个遍历操作就会存在效率的损失。
然而，在这个过程中的属性都被监听到了，但是这个过程之后新增或者删除等操作，都不会被监听到，这个操作在Vue2的created生命周期前就完成了。

但ES6之后出现了Proxy，它可以直接监听一个对象，所以Vue3的优化方案就是直接用Proxy代替Object.defineProperty，然后通过Proxy直接监听整个data，不需要再进行深度遍历，同样给整个data设置getter和setter方法来监听取值和赋值，只要data中任意属性发生变化，就会触发getter和setter这两个函数，这样一来Vue3响应式的效率便会有所提高。

结论

无论是Vue2还是Vue3，都是将响应式数据的取值和赋值变为函数，然后调用这个响应式数据的时候触发对应的getter和setter方法来触发更新。