为什么某些分离的 DOM 与原生 HTML 元素作为保留对象的距离未知？答案

【问题标题】：Why are some Detached DOM have unknown distance with native HTML Elements as retainer Objects?为什么某些分离的 DOM 与原生 HTML 元素作为保留对象的距离未知？
【发布时间】：2018-07-30 19:56:46
【问题描述】：

我注意到一些 Detached DOM 的距离未知，并且保留器有类似 native in HTMLAnchorElement 的东西，而这些保留器不是活动的，也没有显示任何 javascript 引用。为什么这些分离的 DOM 的距离似乎为零-。分离的 DOM 还在保留树中显示 [3404] in (Global handles) @29 、 [13] in (GC roots) @3 。我可以摆脱这个分离的 DOM 的可能方法是什么。特此附上从 macOS 的 Chrome 的 heapsnapshot 中获取的 Detached DOM 的截图。 Screenshot of Detached DOM of unknown Distance 和 Screenshot of Retainers showing Global handles and GC roots

【问题讨论】：

单击工具栏中的垃圾桶图标后这些节点是否会消失（并进行另一个内存快照）？如果是这样，则无需担心，因为垃圾收集器最终会删除它们。
不，即使在我单击工具栏中的垃圾桶图标@wOxxOm 后，这些节点也会出现
@wOxxOm：分离的 DOM 还在保持器树中显示 [3404] in (Global handles) @29 、 [13] in (GC roots) @3 。 Screenshot of retainers showing Global handles

标签： performance google-chrome memory-leaks google-chrome-devtools v8

【解决方案1】：

迟到的答案，但我也浪费了很多时间试图弄清楚这一点。所以希望这可以帮助其他面临类似问题的人。

只需在调试工具中的控制台内运行 clear()，然后拍摄另一个快照。（还要确保你没有设置任何断点）

为什么会这样？我让谷歌解释一下：

有时对象可能会被调试器上下文和 DevTools 保留控制台（例如在控制台评估之后）。创建堆快照清除控制台，调试器中没有活动断点。

（来自：https://developers.google.com/web/tools/chrome-devtools/memory-problems/memory-101）

【讨论】：