• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1<!DOCTYPE HTML>
2
3<!--
4about:memory template page
5-->
6<html id="t">
7  <head>
8    <title>About Memory</title>
9    <link rel="stylesheet" href="shared/css/about_memory.css">
10
11<style>
12body {
13  font-family: Arial, Helvetica, sans-serif;
14}
15div#header select {
16  font-family: Arial, Helvetica, sans-serif;
17}
18div.viewOptions input {
19  font-family: Arial, Helvetica, sans-serif;
20}
21div.otherbrowsers {
22  font-family: Arial, Helvetica, sans-serif;
23}
24table.list#browserComparison tr:not([class*='firstRow']) > *:nth-child(1),
25table.list#browserComparison tr:not([class*='firstRow']) > *:nth-child(4),
26table.list#browserComparison tr.firstRow th:nth-child(1) {
27  border-right: 1px solid #b5c6de;
28}
29table.list#memoryDetails tr:not([class*='firstRow']) > *:nth-child(2),
30table.list#memoryDetails tr:not([class*='firstRow']) > *:nth-child(5),
31table.list#memoryDetails tr.firstRow th:nth-child(2) {
32  border-right: 1px solid #b5c6de;
33}
34</style>
35<script>
36function reload() {
37  if (document.getElementById('helpTooltip'))
38    return;
39  history.go(0);
40}
41
42function formatNumber(str) {
43  str += '';
44  if (str == '0') {
45    return 'N/A ';
46  }
47  var x = str.split('.');
48  var x1 = x[0];
49  var x2 = x.length > 1 ? '.' + x[1] : '';
50  var regex = /(\d+)(\d{3})/;
51  while (regex.test(x1)) {
52    x1 = x1.replace(regex, '$1' + ',' + '$2');
53  }
54  return x1;
55}
56
57function addToSum(id, value) {
58  var target = document.getElementById(id);
59  var sum = parseInt(target.innerHTML);
60  sum += parseInt(value);
61  target.innerHTML = sum;
62}
63
64function handleHelpTooltipMouseOver(event) {
65  var el = document.createElement('div');
66  el.id = 'helpTooltip';
67  el.innerHTML = event.toElement.getElementsByTagName('div')[0].innerHTML;
68  el.style.top = 0;
69  el.style.left = 0;
70  el.style.visibility = 'hidden';
71  document.body.appendChild(el);
72
73  var width = el.offsetWidth;
74  var height = el.offsetHeight;
75
76  if (event.pageX - width - 50 + document.body.scrollLeft >= 0 ) {
77    el.style.left = (event.pageX - width - 20) + 'px';
78  } else {
79    el.style.left = (event.pageX + 20) + 'px';
80  }
81
82
83  if (event.pageY - height - 50 + document.body.scrollTop >= 0) {
84    el.style.top = (event.pageY - height - 20) + 'px';
85  } else {
86    el.style.top = (event.pageY + 20) + 'px';
87  }
88
89  el.style.visibility = 'visible';
90}
91
92function handleHelpTooltipMouseOut(event) {
93  var el = document.getElementById('helpTooltip');
94  el.parentNode.removeChild(el);
95}
96
97function enableHelpTooltips() {
98  var helpEls = document.getElementsByClassName('help');
99
100  for (var i = 0, helpEl; helpEl = helpEls[i]; i++) {
101    helpEl.onmouseover = handleHelpTooltipMouseOver;
102    helpEl.onmouseout = handleHelpTooltipMouseOut;
103  }
104}
105
106//setInterval("reload()", 10000);
107</script>
108</head>
109<body>
110    <div id='header'>
111      <h1>
112        About memory
113      </h1>
114      <p>
115        Measuring memory usage in a multi-process browser
116      </p>
117    </div>
118
119    <div id='content'>
120      <h2>
121        Summary
122        <div class='help'>
123          <div>
124            <p>
125                Summary of memory used by currently active browsers.
126                For browsers which use multiple processes, memory reflects
127                aggregate memory used across all browser processes.<p>
128                For Chromium, processes used to to display diagnostics
129                information (such as this "about:memory") are excluded.
130            </p>
131          </div>
132        </div>
133      </h2>
134
135      <table class='list' id='browserComparison'>
136        <colgroup>
137          <col class='name' />
138          <col class='number' />
139          <col class='number' />
140        </colgroup>
141        <tr class='firstRow doNotFilter'>
142          <th>
143          </th>
144          <th colspan='2'>
145            Memory
146            <div class='help'>
147              <div>
148                <p>
149                  <strong>Memory</strong>
150                </p>
151                <p>
152                  <strong>Private:</strong>
153                  Resident memory size that is not shared with any other process.
154                  This is the best indicator of browser memory resource usage.
155                </p>
156                <p>
157                  <strong>Proportional:</strong>
158                  Accounts for each page of memory as a fraction based on the number of
159                  processes that have it mapped. Thus, for each page of memory mapped by two
160                  processes, this sum will count half of the bytes towards each.
161                  Therefore, this number is greater than the private count.
162                </p>
163
164                <p><i>(Note that the memory for this tab is not included in the browser totals)</i></p>
165              </div>
166            </div>
167          </th>
168        </tr>
169        <tr class='secondRow doNotFilter'>
170          <th class='name'>
171            Browser
172          </th>
173          <th class='name'>
174            Private
175          </th>
176          <th class='number'>
177            Proportional
178          </th>
179        </tr>
180        <tr jsselect="browsers">
181          <td class='name'>
182            <div>
183              <strong jscontent="name"></strong> <span jscontent="version"></span>
184            </div>
185          </td>
186          <td class='number'>
187            <span class='th' jscontent="formatNumber(ws_priv)"></span><span class='k'>k</span>
188          </td>
189          <td class='number'>
190            <span class='th' jscontent="formatNumber(ws_shared)"></span><span class='k'>k</span>
191          </td>
192        </tr>
193      </table>
194      <div class=otherbrowsers jsdisplay="show_other_browsers && browsers.length == 1">
195        Note: If other browsers (e.g. IE, Firefox, Safari) are running,
196        I'll show their memory details here.
197      </div>
198
199      <br /><br /><br />
200
201      <h2>
202        Processes
203        <div class='help'>
204          <div>
205            <p>
206                Details of memory usage for each of Chromium's processes.
207            </p>
208          </div>
209        </div>
210      </h2>
211
212      <table class='list' id='memoryDetails'>
213        <colgroup>
214          <col class='pid' />
215          <col class='name' />
216          <col class='number' />
217          <col class='number' />
218        </colgroup>
219        <tr class='firstRow doNotFilter'>
220          <th>
221          </th>
222          <th>
223          </th>
224          <th colspan='2'>
225            Memory
226          </th>
227        </tr>
228        <tr class='secondRow doNotFilter'>
229          <th class='pid'>
230            PID
231          </th>
232          <th class='name'>
233            Name
234          </th>
235          <th class='number'>
236            Private
237          </th>
238          <th class='number'>
239            Proportional
240          </th>
241        </tr>
242
243        <tr jsselect="browzr_data">
244          <td class='pid'>
245            <span class='th' jscontent="pid"></span>
246          </td>
247          <td class='name'>
248            <div>
249              Browser
250            </div>
251          </td>
252          <td class='number'>
253            <span class='th' jseval="addToSum('tot_ws_priv', $this.ws_priv)" jscontent="formatNumber(ws_priv)"></span><span class='k'>k</span>
254          </td>
255          <td class='number'>
256            <span class='th' jscontent="formatNumber(ws_shared)"></span><span class='k'>k</span>
257          </td>
258        </tr>
259        <tr jsselect="child_data">
260          <td class='pid'>
261            <span class='th' jscontent="pid"></span>
262          </td>
263          <td class='name'>
264            <div jscontent="child_name"></div>
265            <div jsselect="titles">
266              <span jscontent="$this"></span><br>
267            </div>
268          </td>
269          <td class='number'>
270            <span class='th' jseval="addToSum('tot_ws_priv', $this.ws_priv)" jscontent="formatNumber(ws_priv)"></span><span class='k'>k</span>
271          </td>
272          <td class='number'>
273            <span class='th' jscontent="formatNumber(ws_shared)"></span><span class='k'>k</span>
274          </td>
275        </tr>
276        <tr class='total doNotFilter'>
277          <td class='pid'>
278          </td>
279          <td class='name'>
280            &Sigma;
281          </td>
282          <td class='number'>
283            <span class='th' id="tot_ws_priv">0</span><span class='k'>k</span>
284          </td>
285          <td class='number'>
286          </td>
287        </tr>
288
289        <tr class='noResults'>
290          <td colspan='99'>
291            No results found.
292          </td>
293        </tr>
294      </table>
295
296      <div class="otherbrowsers">(The memory usage of our renderer processes is slightly less accurate when they are sandboxed.)</div>
297
298    </div>
299</body>
300<script>
301  enableHelpTooltips();
302</script>
303</html>
304