Vue的batching机制是在单次同步任务中合并所有响应式更新为一次异步执行，通过异步队列+微任务调度+去重保障副作用只执行一次，避免重复渲染与计算，提升性能。
Vue 的 batching 机制不是“等一堆变化攒够了再更新”，而是在一次同步任务中，把所有触发的更新任务合并成一次异步执行。它解决的核心问题是：避免同一轮数据修改引发多次重复渲染或计算，从而节省性能开销。
为什么需要 batching
没有 batching 时，连续修改多个响应式字段（甚至同一个字段多次）会导致：
- 每次赋值都触发依赖通知 → 多次加入更新队列
- 每次都立即执行渲染或 computed 重算 → 视图反复重绘、逻辑反复执行
- 用户感知卡顿，尤其在循环或事件处理中频繁赋值时
batching 是怎么工作的
关键不在“收集”，而在“调度”和“去重”：
- 数据变化时，
trigger不直接运行副作用，而是调用queueJob把 effect 推入一个全局微任务队列 -
queueJob会检查该 effect 是否已在当前队列中，已存在则跳过（自动去重） - 同步代码执行完后，在下一个
Promise.then（microtask）中统一清空并执行队列 - 此时所有被标记为“需更新”的组件、watcher、computed 都只执行一次
哪些操作会被 batch 合并
只要是发生在同一个同步上下文里的响应式变更，都会被纳入同一批次：
立即学习“前端免费学习笔记（深入）”；
- 模板中多次修改
ref或reactive属性 - 在一个
click回调里连续设置多个状态 - 循环中批量更新数组项（前提是用的是响应式方法如
push、splice） - 嵌套对象属性变更（通过 Proxy 拦截，同样走 trigger → queueJob 流程）
什么时候 batching 会失效
手动打破同步上下文，就会跳出当前批次：
- 使用
setTimeout、setImmediate等宏任务延迟赋值 → 进入新 tick - 在
await后继续修改响应式数据 → microtask 已执行完毕，开启新批次 - 显式调用
flushSync强制同步更新 → 绕过队列，立即执行
