Vue 3 的响应式系统是如何实现的？

Vue 3 用 ES Proxy 替代 Vue 2 的 Object.defineProperty：reactive 返回对象的代理，get 时通过 track() 把当前正在执行的 effect（如组件渲染函数）收集进依赖表（target → key → dep 的 WeakMap 结构），set 时通过 trigger() 通知相关 effect 重新执行。

相比 Vue 2：Proxy 能监听新增、删除属性以及数组下标和 length 变化，不再需要 Vue.set；且是惰性代理，深层对象只在访问时才递归包装。ref 是对任意值的包装（.value），其 get/set 同样走 track/trigger。易错点：解构 reactive 对象会丢响应式（应用 toRefs）；整体替换 reactive 的引用会断开追踪。追问：effect 调度与 scheduler、computed 的懒计算与脏检查、Vue 3.4 起 computed 的优化。

const state = reactive({ count: 0 })
effect(() => console.log(state.count)) // 依赖被收集
state.count++ // trigger 触发重跑