This repository has been archived by the owner on Nov 8, 2023. It is now read-only.
/
heap-profiling-dominators.html
78 lines (59 loc) · 2.24 KB
/
heap-profiling-dominators.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
{{+bindTo:partials.standard_devtools_article}}
<p class="caution">
<strong style="font-weight: normal; font-size: 110%; display:block;">The DevTools docs have moved!</strong>
For the latest tutorials, docs and updates <a href="https://developers.google.com/web/tools/chrome-devtools">head over to the new home of Chrome DevTools</a>.
</p>
<h1>Finding Accumulation Points</h1>
<script type="text/javascript" src="//developers.google.com/chrome-developer-tools/docs/heap-profiling-dominators-files/script.js"></script>
<p>This page demonstrates how accumulation points can be detected
using the Heap
Profiler.</p>
<p>Below is the source code of the script, for reference:</p>
<pre class="prettyprint">
function CollectionItem(s)
{
this.s = s;
}
function Collection()
{
this.items = [];
}
Collection.prototype = {
add: function(item)
{
this.items.push(item);
},
item: function(index)
{
return this.items[index];
}
}
function createCollection(count)
{
var collection = new Collection();
for (var i = 0; i < count; ++i)
collection.add(new CollectionItem(i.toString()));
return collection;
}
var holder1 = [createCollection(10000), createCollection(15000)];
var holder2 = [holder1[0]];
</pre>
<p>Using the <strong>Dominators</strong> view, it's easy to spot
collection objects that are small by themselves but retain lots of
memory. In the <strong>Dominators</strong> view, find the
<code>DOMWindows</code> node (usually, the topmost one) and expand
it. Look at the top two child nodes (by default nodes are sorted
by their retained size). The first one is a system wrapper
around the <code>holder1</code> array. The second one is the
<code>Collection</code> node. Both of them have
small shallow size, but big retained size, due to a fact that
they hold lots of <code>CollectionItem</code>
objects.</p>
<p>Note that the <strong>Dominators</strong> reveals dependencies
between objects, not their references. For example, one of
the <code>Collection</code> objects is shared between two arrays, thus
it is not retained by any of them, but by the <code>DOMWindows</code>
object.</p>
<p>To see, how an object is actually referenced, click on it, and
look at the lower panel that shows retaining paths.</p>
{{/partials.standard_devtools_article}}