识别分离 dom 树需通过堆快照或“detached elements”分析类型定位已移除但被 js 引用的节点，结合保留树追溯引用源头，再结合复用逻辑与分配时序验证是否为真实内存泄漏。
识别分离的 DOM 树，核心是确认那些已从文档中移除、却仍被 JavaScript 持有引用的节点。这类节点无法被垃圾回收，是内存泄漏的典型信号。
在堆快照中直接查找 Detached DOM trees
打开 Chrome 或 Edge 的 DevTools → Memory 面板 → 选择 “Heap snapshot” → 点击 “Take snapshot”。操作疑似泄漏的流程（如切换页面、关闭弹窗、销毁组件）后，再拍一张快照。切换到 Comparison 视图，筛选构造函数名含 Detached 的条目，例如：
-
HTMLDivElement（后面标注 (detached)） -
HTMLUListElement（带 (detached)） - 或直接搜索关键词 detached，结果会高亮所有分离节点
用“分离元素”专用分析类型快速定位
该工具专为检测分离 DOM 设计，比堆快照更直观：
Java Maven Common
下载
Java Maven 项目审查工作流的通用输入处理。当 Java Maven 项目以 ZIP压缩包或 GitLab 仓库 URL 形式提供且需要...时使用。
- 在 Memory 面板中选择 “Detached elements” 分析类型
- 先点 Collect garbage（触发 GC，清掉本可回收的对象）
- 再点 Capture detached elements（获取当前仍存活的分离节点）
- 列表中显示的每个 DOM 节点都处于“已脱离但未释放”状态，展开可看完整子树结构
结合保留树（Retaining tree）追查引用源头
发现某个分离节点后，不能只删节点，要找到谁在“拽着它不放”：
- 在分离元素列表中点击该节点的 ID，DevTools 会自动跳转到对应堆快照中的保留者对象
- 查看右侧的 Retaining tree，逐层展开，直到看到具体的变量名或闭包（如
unmounted数组、eventHandlers对象、this.cache） - 常见保留者包括：未清理的事件监听器、定时器回调里的闭包、全局或长生命周期对象持有的 DOM 引用、框架组件卸载后残留的 ref 或 state
验证是否真为泄漏：检查是否会被复用
不是所有分离节点都是问题——有些是设计上暂存待重用的：
- 若节点被缓存在
WeakMap或临时数组中，且后续明确会appendChild回 DOM，则属合理行为 - 若节点长期滞留、数量随操作线性增长、且无复用逻辑，则基本可判定为泄漏
- 配合 Allocation Timeline 查看这些节点的分配时间与存活时长，能进一步佐证
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
