При анализе снимков кучи с помощью Chrome devtools я не могу понять, что означают цвета при просмотре отдельных деревьев DOM. В чем разница между красным и желтым?
Что означают цвета для отдельных узлов DOM в Chrome Heap Profiler?
Ответ 1
Здесь есть хорошее объяснение .
Из статьи:
У красных узлов нет прямых ссылок с JavaScript на них, но живы, потому что они являются частью отдельного дерева DOM. Может быть node в дереве, на который ссылается JavaScript (возможно, как закрытие или переменная), но по совпадению предотвращает все дерево DOM будучи собранным мусором.
Однако желтые узлы имеют прямые ссылки на JavaScript. Ищите желтые узлы в том же отдельном DOM, чтобы найти ссылки на ваш JavaScript. Должно быть цепочку свойств, ведущую из окна DOM к элементу (например, window.foo.bar [2].baz).
Ответ 2
Я не нашел окончательного ответа, но это кажется последовательным:
Красный фон указывает на отдельный DOM node, на который ссылается переменная в закрытии.
Желтый фон указывает на отдельный DOM node, на который ссылаются свойство объекта или элемент массива.