长周期全局DOM节点上未解绑的闭包回调会导致内存泄漏，定位需通过Chrome Memory面板对比堆快照，筛选Detached元素并检查Retainers中window/document→addEventListener→closure路径，重点验证闭包Scope是否持有全局节点或其子节点。
长周期全局 DOM 节点（如 window、document、body）上绑定的事件监听器，一旦使用闭包回调且未及时解绑，就会让整个闭包作用域被长期持有——DOM 节点没卸载，闭包就一直活，它捕获的组件实例、大数组、ref.current 等全卡住不释放。定位这类泄漏，关键不是找“闭包”，而是找“谁在 hold 住全局节点 + 闭包链”。
直接抓 Detached DOM + 全局引用链
打开 Chrome DevTools → Memory 面板 → Take heap snapshot（基线）→ 执行目标操作（如打开/关闭弹窗、切换路由）→ 点击垃圾桶图标强制 GC → 再拍一张快照 → 切换到 Comparison 视图：
- 筛选条件设为：Constructor 包含 HTMLDivElement / HTMLButtonElement 等实际泄漏标签名
- 勾选 Show detached elements only
- 观察 #Delta > 0 且 Retained Size 明显增长 的条目
- 点开任一 Detached 节点 → 右侧 Retainers 中重点找：window → addEventListener → closure → function 或 document → eventListener → closure 这类路径
检查闭包是否隐式捕获了全局节点本身
常见错误不是“用了闭包”，而是闭包里多拿了一个不该拿的对象。比如：
-
document.addEventListener('click', () => console.log(document.getElementById('app')))—— 直接访问document本身，又通过getElementById拿到节点，双重强引用 -
window.addEventListener('resize', () => this.updateSize())（在类组件中）——this被闭包，而this又持有 DOM ref - 用箭头函数绑定后，没存引用，导致
removeEventListener无法匹配旧函数
真正要检查的是：闭包 Scope 面板里是否出现 window、document、body 或它们返回的 DOM 节点；这些对象只要出现在 Scope 中，就说明闭包正在长期持有它们。
验证监听器是否真被解绑
即使写了 removeEventListener，也可能因函数引用不一致而失效：
- 避免内联写法：
el.addEventListener('click', () => {})→ 改用具名函数：const handler = () => {};→el.addEventListener('click', handler)→el.removeEventListener('click', handler) - React 函数组件中，
useEffect清理函数必须返回同步解绑逻辑，不能包裹setTimeout或异步调用 - 推荐现代方案：
const controller = new AbortController();→el.addEventListener('click', handler, { signal: controller.signal })→ 清理时只需controller.abort()，无需关心函数引用
排查定时器与全局事件总线的交叉引用
全局节点常和定时器、事件总线耦合，形成隐蔽泄漏链：
- 搜索堆快照中的
setInterval或setTimeout实例，看其 Closure 的 Retained Size 是否异常高；点开 Scope，确认是否包含window、document或大型 state - 检查全局 emitter（如
EventBus.emit）是否在组件卸载后仍持有闭包回调；尤其注意on和off是否配对，是否用同一函数引用 - 若使用自定义事件系统，确保其内部也暴露
destroy或clear方法，并在组件销毁时调用
