支配者树是反映“谁不释放谁就无法被回收”的逻辑结构,直接定位导致内存峰值的顶层支配对象;其Retained Size越大,说明该对象锁死的内存越多,往往是泄漏源头或误缓存根节点。

什么是支配者树,它和内存峰值有什么直接关系
支配者树(Dominators Tree)不是堆快照里“看起来最占内存”的那个节点,而是能回答“如果删掉这个对象,有多少其他对象会随之不可达”的结构。内存峰值瞬间异常,往往不是因为某个对象特别大,而是某段代码触发了一连串本不该长期存活的对象创建,而这些对象恰好都由一个共同父级支配——这个父级通常就是泄漏源头或误缓存的根。
支配者树把对象按支配关系组织成树:每个节点支配其所有子节点(即子节点的 GC Roots 路径都必须经过它)。所以,当你看到某个 ArrayList 在支配者树顶部占了 85% 的保留大小(Retained Size),基本可以断定:所有被它间接持有的对象,生命周期都被它锁死了。
在 Chrome DevTools 中打开支配者树并识别可疑顶层节点
Chrome 95+ 的 Memory 面板已默认支持支配者树视图,但需主动切换:
- 拍摄堆快照后,点击右上角
Summary下拉菜单 → 选Dominators - 确保列已显示
Retained Size(默认有),并按该列降序排列 - 关键动作:只看“第一层子节点”(即直接挂在全局 GC Roots 下的那些节点),忽略深层嵌套
常见可疑顶层节点包括:
-
window或globalThis下挂载的未清理Map/Set实例(尤其带闭包引用) - 框架内部的
<strong>vue_devtools<strong></strong></strong>或REACT_DEVTOOLS_GLOBAL_HOOK挂载点(开发环境易残留监听器) - 被意外赋值给
console、localStorage或全局__debug_data的大型数据结构 - 未解除的
addEventListener绑定,其回调闭包捕获了整个组件作用域(表现为支配树中某个function占 Retained Size 前三)
如何验证某个支配节点是否真由你的业务代码触发
不能只看对象类型,要回溯到谁创建了它、谁把它挂到了支配位置:
- 在支配者树中右键点击高 Retained Size 的节点 →
Reveal in Summary view - 切换到
Summary视图,找到该对象 → 点击右侧retainers标签页 - 展开 retainers 链,逐层向上看:重点找含业务文件名(如
chart.ts、data-loader.js)或函数名(如initCache、handleUpload)的引用路径
容易踩的坑:
- 把
Promise或setTimeout回调里的闭包当成“临时对象”,其实它们可能长期持有上游数据(尤其当 Promise 未 resolve/reject 时) - 忽略
WeakMap的 key 是弱引用,但 value 不是——如果 value 是个大数组,且 key 被其他强引用持有着,它照样进支配树顶部 - 框架 HMR(热更新)残留的旧模块实例常以
module.exports形式挂在require.cache下,表现为支配树中多个重复的Object占用,需检查是否忘了module.hot.dispose
快速缩小范围:用时间差快照对比定位“瞬间峰值”来源
单张快照只能看静态快照,而“瞬间异常”需要捕捉变化过程:
- 在疑似操作前(如点击“加载报表”按钮前)拍一张快照(Snap1)
- 执行操作,等内存升到峰值但尚未 GC 时(可用 Performance 面板观察 JS Heap 曲线陡升处),立即拍第二张(Snap2)
- 在 Snap2 的支配者树中,右键任意节点 →
Compare to previous snapshot - 此时只显示 Snap2 新增/增长显著的对象,过滤掉基础框架开销
重点关注:
- Retained Size delta > 5MB 且类型为
ArrayBuffer、TypedArray或JSON.stringify结果的String—— 往往对应前端 Excel 导出、图像处理或未分页的大列表渲染 - 新增的
HTMLDivElement+ 大量子节点,但父容器已被remove()—— 说明 DOM 引用未清,常见于手动innerHTML = ''后没解绑事件或清除IntersectionObserver
真正难的不是找到支配节点,而是确认它是否“本不该存在”。比如一个 Map 占了 200MB,你得顺着 retainers 看清:它是被某个 useEffect 里反复 set 却没 clear,还是被某个未取消的 fetch 的 .then 闭包持续引用——后者往往藏在第三层 retainers 之后,需要手动展开到底。

















