这些颜色对Chrome Heap Profiler中分离的DOM节点意味着什么？

Question

在使用Chrome devtools分析堆快照时,我似乎无法弄清楚在查看Detached DOM Trees时颜色的含义.红色和黄色有什么区别？

Answer 1

这是一个很好的解释可以在这里找到.

来自文章:

红色节点没有从JavaScript到它们的直接引用,但它们是活动的,因为它们是分离的DOM树的一部分.从JavaScript引用的树中可能存在一个节点(可能作为闭包或变量),但巧合地阻止整个DOM树被垃圾收集.

但是黄色节点确实有来自JavaScript的直接引用.在同一个分离的DOM树中查找黄色节点,以查找JavaScript中的引用.应该有从DOM窗口到元素的一系列属性(例如window.foo.bar [2] .baz).