google-chrome - Chrome 堆分析器中对象标题的黄色背景意味着什么?

标签 google-chrome heap-memory developer-tools heap-profiling

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

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

Heap Snapshot

最佳答案

好吧,黄色背景意味着拥有它的对象有 JavaScript 句柄,或者可以说可以从 JavaScript 访问,而没有背景(或白色)的对象则不能从 JavaScript 访问,但可以仍然可以从图的根部到达。

最有趣的似乎是一个红色背景的物体。红色背景意味着拥有它的对象是分离的 DOM 树的一部分。所以它基本上是一个 DOM 元素,无法从根节点访问,但被其他一些对象引用,而这些对象又可以从 JavaScript 访问(具有黄色背景)。

来自 great write-up 的简短引用作者:阿迪·奥斯马尼:

Q: I noticed a number of DOM nodes in the heap snapshot where some are highlighted in red and indicated as a "Detached DOM tree" whilst others are yellow. What does this mean?

You'll notice nodes of a few different colors. Red nodes do not have direct references to JavaScript from them, but are alive because they’re part of a detached DOM tree. There may be a node in the tree referenced from JavaScript (maybe as a closure or variable) but is coincidentally preventing the entire DOM tree from being garbage collected.

Yellow nodes however do have direct references to JavaScript. Look for yellow nodes in the same detached DOM tree to locate references from your JavaScript. There should be a chain of properties leading from the DOM window to the element (e.g window.foo.bar[2].baz).

关于google-chrome - Chrome 堆分析器中对象标题的黄色背景意味着什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15394212/

相关文章:

Chrome 扩展程序的 Javascript 外部脚本无法正常工作

internet-explorer - 我们可以将开发人员工具中的 IE 控制台保存到文件中吗?

javascript - webpack 中的 sourcemaps 有什么区别

google-chrome - Chrome 开发者工具放大镜已从 Chrome 32 中消失

javascript - Array() 中的 getElementById() 会覆盖数组中的其他元素

ajax - "Cache-Control: only-if-cached"离线时即使响应被缓存也会失败

javascript - 呈现日期的差异 - IE JavaScript 与 Chrome JavaScript

pointers - Rust 如何知道哪些类型拥有资源?

java - for 循环在 Android 设备上非常慢

c++ - 虚拟析构函数和内存释放