Chrome的堆分析器中黄色背景对对象标题的含义是什么？

Question

试着在Chrome开发者工具中了解堆分析器.我在快照中看到几个可到达的对象,其中一些有黄色背景,有些没有.这是什么意思？有什么不同？

在这种情况下,颜色图例并不完全有用,因为它本身具有黄色背景(wtf).

Answer 1

好的,结果是黄色背景意味着拥有它的对象上有一个JavaScript句柄,或者说可以从JavaScript访问,而没有背景(或白色)的对象无法从JavaScript访问,但仍然可以访问从图的根.

最有趣的似乎是一个红色背景的对象.红色背景表示具有它的对象是分离的DOM树的一部分.所以它基本上是一个DOM元素,它不能从根节点到达,但是被其他一些对象引用,它可以从JavaScript访问(有黄色背景).

Addy Osmani 撰写的精彩文章简短引用:

问:我注意到堆快照中有许多DOM节点,其中一些以红色突出显示,并表示为"分离的DOM树",而其他节点为黄色.这是什么意思？

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

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