this is more or less an addendum to choosing the correct process in chrome
before beginning its probably best to warn you, this is best done by advanced computer users, there is a possibility for you to mess up your software if you screw this up. and really, you should inspect the code i will post here, and not just blindly trust internet strangers.
Sometimes its useful to know the hex value of the pid of chrome processes. but chrome only gives the PID in decimal, so i figured i would rectify that situation with some code.
When I first delved into this, I hoped it would be as simple as making and installing an extension. Unfortunately, its a tad more complicated(or less as the case may be) than all that.
Most PE (portable executable) files have embedded resources in them. This can be images or even just text strings, pretty much whatever. When we look at chrome's memory manager, we know that there must be an html template for it somewhere. It is embedded inside of chrome.dll so we will need a tool to edit it.
If you dont have it already, go grab a copy of reshacker from http://www.angusj.com/resourcehacker/ Its an awesome tool and can even be used to customize your windows settings like the start menu icon.
so go ahead and run reshacker, and open chrome .dll which is located in c:/users/username/appdata/local/google/chrome/application/version number
if you have multiple versions, pick the folder with the biggest number
(broken image removed)
once you open it, you will see this.
(broken image removed)
Expand the bin data folder and then expand the 500 folder then click on the gear labeled 0.
in the right side it should say "about:memory template page"
(broken image removed)
just take all that text in there and replace it with this
<!DOCTYPE HTML>
<!--
about:memory template page
-->
<html id="t">
<head>
<title>About Memory</title>
<style>
body {
font-size: 84%;
font-family: Helvetica, Arial, sans-serif;
padding: 0.75em;
margin: 0;
min-width: 45em;
}
h1 {
font-size: 110%;
font-weight: bold;
color: #4a8ee6;
letter-spacing: -1px;
padding: 0;
margin: 0;
}
h2 {
font-size: 110%;
letter-spacing: -1px;
font-weight: normal;
color: #4a8ee6;
padding: 0;
margin: 0;
padding: 0.5em 1em;
color: #3a75bd;
margin-left: -38px;
padding-left: 38px;
border-top: 1px solid #3a75bd;
padding-top: 0.5em;
}
h2:first-child {
border-top: 0;
padding-top: 0;
}
span.th {
padding-left: 0.35em;
}
a {
color: black;
}
div#header {
padding: 0.75em 1em;
padding-top: 0.6em;
padding-left: 0;
margin-bottom: 0.75em;
position: relative;
overflow: hidden;
background: #5296de;
background-size: 100%;
border: 1px solid #3a75bd;
border-radius: 6px;
color: white;
text-shadow: 0 0 2px black;
}
div#header h1 {
padding-left: 37px;
margin: 0;
display: inline;
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAAPCAQAAACouOyaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAQdJREFUKJFl0CFOA1EQBuAnED3BChQoFJyCG6BwOC4ApqooOACoqgqqUBhMTVURmAoqHqLJbsJLuiSvockKzIdoS1jIqJn5Msk/QRAE+27MdDfdg8qlzroLm+GLrFIZuPWoVqrct8lYaS6aq5RKUdRvk54kil49m4miN6dtUll4NXSoUBiYiyZbsufMvSy5EH5qqFLqOxaCicbKwlTxi+yqlZKFq2BkpZbMtiEFQSFLSu+ug6FPtWT+j2RJ0gv2dGUf6m0CQdD3JXty6mA7WqMThY7CncanaTv0rSzLoqkFGtl5m0w0smyl0Whky7/fXUfPxl6sNhdHbRJ0JSMdO3Y8Weo5Wm++Ac2ic0DR0k0+AAAAAElFTkSuQmCC") 12px 60% no-repeat;
color: white;
}
div#header p {
font-size: 84%;
font-style: italic;
padding: 0;
margin: 0;
color: white;
padding-left: 0.4em;
display: inline;
}
div#header div.navigation {
position: absolute;
top: 0;
right: 1em;
line-height: 3.5em;
font-size: 92%;
}
div#header select {
font-size: 100%;
font-family: Helvetica, Arial, sans-serif;
border: 1px solid #3a75bd;
line-height: 140%;
color: #315d94;
}
div#header select option {
padding: 0 0.2em;
}
div#sidebar {
display: none;
float: left;
margin-left: 26px;
width: 45em;
min-height: 20em;
padding: 0.75em;
padding-top: 0;
border-right: 1px solid #cfcfcf;
}
div#content {
margin-left: 0px;
}
div.viewOptions {
float: right;
font-size: 92%;
color: #5f5f5f;
margin-top: 1em;
}
hr {
visibility: hidden;
display: inline;
padding: 0 0.5em;
}
div.viewOptions input {
font-family: Helvetica, Arial, sans-serif;
font-size: 100%;
border: 1px solid #b5b5b5;
border-radius: 6px;
padding: 0.3em 0.4em;
}
div.viewOptions input:focus {
border-color: white;
}
.k {
opacity: 0.4;
font-weight: normal;
padding-left: 0.1em;
}
.legend {
font-size: 84%;
padding: 0;
padding-top: 0.4em;
margin-top: 2em;
text-align: right;
line-height: 140%;
color: #7f7f7f;
}
.legend h3 {
padding: 0;
padding-right: 0.5em;
margin: 0;
font-weight: normal;
color: black;
display: inline;
font-size: 100%;
}
.legend .swatch {
opacity: 0.66;
padding: 0 0.5em;
display: inline-block;
margin-right: 0.2em;
height: 0.9em;
}
.legend .swatch.heavyUse {
background: #cc0000;
}
table.list {
width: 100%;
line-height: 200%;
border-collapse: collapse;
font-size: 84%;
table-layout: fixed;
}
table.list:not([class*='filtered']) tr:nth-child(odd) td {
background: #eff3ff;
}
.hidden {
display: none;
}
table.list th {
padding: 0 0.5em;
vertical-align: top;
font-weight: bold;
color: #315d94;
color: black;
white-space: nowrap;
}
table.list .firstRow th {
text-align: left;
line-height: 100%;
}
table.list .secondRow * {
text-align: left;
border-bottom: 1px solid #b5c6de;
}
table.list td {
padding: 0 0.5em;
vertical-align: top;
line-height: 1.4em;
padding-top: 0.35em;
}
table.list tr td:nth-last-child(1),
table.list tr th:nth-last-child(1) {
padding-right: 1em;
}
table.list:not([class*='filtered']) .tab .name {
padding-left: 1.5em;
}
table.list .name {
width: 100%;
}
table.list .name div {
height: 1.6em;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
table.list .pid {
width: 8em;
text-align: right;
}
table.list .pid .th {
padding: 0;
}
table.list .type {
width: 5em;
}
table.list .number {
width: 7em;
text-align: right;
}
table.list .total {
font-weight: bold;
}
table.list .total .name {
color: #315d94;
text-align: right;
}
table.list .total td {
border-top: 1px solid #b5c6de;
background: white !important;
}
table.list .noResults {
display: none;
}
table.list.noResults .noResults {
display: table-row;
}
table.list .noResults td {
text-align: center;
padding: 3em 0;
color: #3f3f3f;
}
.heavyUse {
color: #cc0000;
font-weight: bold;
}
table.list#memoryDetails tr:not([class*='firstRow']) > *:nth-child(2),
table.list#memoryDetails tr:not([class*='firstRow']) > *:nth-child(5),
table.list#memoryDetails tr.firstRow th:nth-child(2),
table.list#memoryDetails tr.firstRow th:nth-child(3) {
border-right: 1px solid #b5c6de;
}
table.list#browserComparison tr:not([class*='firstRow']) > *:nth-child(1),
table.list#browserComparison tr:not([class*='firstRow']) > *:nth-child(4),
table.list#browserComparison tr.firstRow th:nth-child(1),
table.list#browserComparison tr.firstRow th:nth-child(2) {
border-right: 1px solid #b5c6de;
}
table.list#browserComparison .name {
padding-left: 25px;
background-position: 5px center;
background-repeat: no-repeat;
}
div.help {
display: inline-block;
width: 14px;
margin: -1px 0;
height: 14px;
background: url("data:image/gif;base64,R0lGODlhDAAMAMQAAAAAAP////T4/ujx/ery/UKP7k6W71CX71KY71Sa8Gak8XGr8nWu83ev83qv83ux83yx832y85XA9aHH96rN+KvO+KzO+K3O+LnV+cTc+tDj+9Xm+////wAAAAAAAAAAACH5BAEAABwALAAAAAAMAAwAAAVKIMcRVoMgjUWI3BYVcOxs41tIGqbAEQkvgshkECv9XopAzBQrKASX2KmZyTRRzUYia2lqdkWCrbAwxHqtRxMGoYkIFcbhwKCsOCEAOw==") center bottom no-repeat;
opacity: 0.33;
}
div.help:hover {
opacity: 1;
}
div.help div {
display: none;
}
#helpTooltip {
z-index: 1000;
position: absolute;
background: #d6e8ff;
padding: 0.3em 0.8em;
max-width: 30em;
-webkit-box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.33);
border: 1px solid #a8cfff;
border-radius: 0;
line-height: 140%;
font-size: 92%;
}
#helpTooltip p {
margin: 0.6em 0;
}
div.otherbrowsers {
font-family: Helvetica, Arial, sans-serif;
font-size: 84%;
width: 100%;
text-align: center;
}
</style>
<script>
function hexPID(value){
var pid = value + "--->hex= "+value.toString(16);
return pid;
}
function reload() {
if (document.getElementById('helpTooltip'))
return;
history.go(0);
}
function formatNumber(str) {
str += '';
if (str == '0') {
return 'N/A ';
}
var sataniclulz = str.split('.');
var x1 = sataniclulz[0];
var x2 = sataniclulz.length > 1 ? '.' + sataniclulz[1] : '';
var regex = /(d+)(d{3})/
while (regex.test(x1)) {
x1 = x1.replace(regex, '$1' + ',' + '$2');
}
return x1;
}
function addToSum(id, value) {
var target = document.getElementById(id);
var sum = parseInt(target.innerHTML);
sum += parseInt(value);
target.innerHTML = sum;
}
function handleHelpTooltipMouseOver(event) {
var el = document.createElement('div');
el.id = 'helpTooltip';
el.innerHTML = event.toElement.getElementsByTagName('div')[0].innerHTML;
el.style.top = 0;
el.style.left = 0;
el.style.visibility = 'hidden';
document.body.appendChild(el);
var width = el.offsetWidth;
var height = el.offsetHeight;
if (event.pageX - width - 50 + document.body.scrollLeft >= 0 ) {
el.style.left = (event.pageX - width - 20) + 'px';
} else {
el.style.left = (event.pageX + 20) + 'px';
}
if (event.pageY - height - 50 + document.body.scrollTop >= 0) {
el.style.top = (event.pageY - height - 20) + 'px';
} else {
el.style.top = (event.pageY + 20) + 'px';
}
el.style.visibility = 'visible';
}
function handleHelpTooltipMouseOut(event) {
var el = document.getElementById('helpTooltip');
el.parentNode.removeChild(el);
}
function enableHelpTooltips() {
var helpEls = document.getElementsByClassName('help');
for (var i = 0, helpEl; helpEl = helpEls[i]; i++) {
helpEl.onmouseover = handleHelpTooltipMouseOver;
helpEl.onmouseout = handleHelpTooltipMouseOut;
}
}
//setInterval("reload()", 10000);
</script>
</head>
<body>
<div id='header'>
<h1>
About memory
</h1>
<p>
Measuring memory usage in a multi-process browser
</p>
</div>
<div id='content'>
<h2>
Summary
<div class='help'>
<div>
<p>
Summary of memory used by currently active browsers. For browsers
which use multiple processes, memory reflects aggregate memory
used across all browser processes.
</p>
<p>
For <span jscontent="current_browser_name"></span>, processes used
to to display diagnostics information (such as this
"about:memory") are excluded.
</p>
</div>
</div>
</h2>
<table class='list' id='browserComparison'>
<colgroup>
<col class='name' />
<col class='number' />
<col class='number' />
<col class='number' />
<col class='number' />
<col class='number' />
</colgroup>
<tr class='firstRow doNotFilter'>
<th>
</th>
<th colspan='3'>
Memory
<div class='help'>
<div>
<p>
<strong>Memory</strong>
</p>
<p>
<strong>Private:</strong>
Resident memory size that is not shared with any other
process. This is the best indicator of browser memory
resource usage.
</p>
<p>
<strong>Shared:</strong>
Resident memory size that is currently shared with 2 or more
processes. Note: For browsers using multiple processes, if we
simply added the shared memory of each individual process,
this value would be inflated. Therefore, this value is
computed as an approximate value for shared memory in each of
the browser's processes. Note also that shared memory varies
depending on what other processes are running on the system,
and may be difficult to measure reproducibly.
</p>
<p>
<strong>Total:</strong>
The sum of the private + shared resident memory sizes.
</p>
</div>
</div>
</th>
<th colspan='2'>
Virtual memory
<div class='help'>
<div>
<p>
<strong>Virtual memory</strong>
</p>
<p>
<strong>Private:</strong>
The resident and paged bytes committed for use by only this
process.
</p>
<p>
<strong>Mapped:</strong>
Total bytes allocated by this process that are mapped into the
view of a section, backed by either system pagefile or file
system. This is primarily memory-mapped files.
</p>
</div>
</div>
</th>
</tr>
<tr class='secondRow doNotFilter'>
<th class='name'>
Browser
</th>
<th class='name'>
Private
</th>
<th class='number'>
Shared
</th>
<th class='number'>
Total
</th>
<th class='number'>
Private
</th>
<th class='number'>
Mapped
</th>
</tr>
<tr jsselect="browsers">
<td class='name'>
<div>
<strong jscontent="name"></strong>
<span jscontent="version"></span>
</div>
</td>
<td class='number'>
<span class='th'
jscontent="formatNumber(ws_priv + ws_shareable - ws_shared)">
</span><span class='k'>k</span>
</td>
<td class='number'>
<span class='th' jscontent="formatNumber(ws_shared / processes)">
</span><span class='k'>k</span>
</td>
<td class='number'>
<span class='th'
jscontent="formatNumber(ws_priv + ws_shareable - ws_shared +
(ws_shared / processes))"></span><span class='k'>k</span>
</td>
<td class='number'>
<span class='th' jscontent="formatNumber(comm_priv)"></span>
<span class='k'>k</span>
</td>
<td class='number'>
<span class='th' jscontent="formatNumber(comm_map)"></span>
<span class='k'>k</span>
</td>
</tr>
</table>
<div class=otherbrowsers jsdisplay="browsers.length == 1">
Note: If other browsers (e.g. IE, Firefox, Safari) are running,
I'll show their memory details here.
</div>
<br /><br /><br />
<h2>
Processes
<div class='help'>
<div>
<p>
Details of memory usage for each of
<span jscontent="current_browser_name"></span>'s processes.
</p>
</div>
</div>
</h2>
<table class='list' id='memoryDetails'>
<colgroup>
<col class='pid' />
<col class='name' />
<col class='number' />
<col class='number' />
<col class='number' />
<col class='number' />
<col class='number' />
</colgroup>
<tr class='firstRow doNotFilter'>
<th>
</th>
<th>
</th>
<th colspan='3'>
Memory
</th>
<th colspan='2'>
Virtual memory
</th>
</tr>
<tr class='secondRow doNotFilter'>
<th class='pid'>
PID
</th>
<th class='name'>
Name
</th>
<th class='number'>
Private
</th>
<th class='number'>
Shared
</th>
<th class='number'>
Total
</th>
<th class='number'>
Private
</th>
<th class='number'>
Mapped
</th>
</tr>
<tr jsselect="browzr_data">
<td class='pid'>
<span class='th' jscontent="hexPID($this.pid)"></span>
</td>
<td class='name'>
<div>
Browser
</div>
</td>
<td class='number'>
<span class='th' jseval="addToSum('tot_ws_priv', $this.ws_priv +
$this.ws_shareable - $this.ws_shared)" jscontent="ws_priv +
ws_shareable - ws_shared"></span><span class='k'>k</span>
</td>
<td class='number'>
<span class='th' jscontent="ws_shared"></span>
<span class='k'>k</span>
</td>
<td class='number'>
<span class='th' jseval="addToSum('tot_ws_tot', $this.ws_priv +
$this.ws_shareable)" jscontent="ws_priv +
ws_shareable"></span><span class='k'>k</span>
</td>
<td class='number'>
<span class='th' jseval="addToSum('tot_comm_priv', $this.comm_priv)"
jscontent="comm_priv"></span><span class='k'>k</span>
</td>
<td class='number'>
<span class='th' jseval="addToSum('tot_comm_map', $this.comm_map)"
jscontent="comm_map"></span><span class='k'>k</span>
</td>
</tr>
<tr jsselect="child_data">
<td class='pid'>
<span class='th' jscontent="hexPID($this.pid)"></span>
</td>
<td class='name'>
<div jscontent="child_name"></div>
<div jsselect="titles">
<span jscontent="$this"></span><br>
</div>
</td>
<td class='number'>
<span class='th' jseval="addToSum('tot_ws_priv', $this.ws_priv +
$this.ws_shareable - $this.ws_shared)" jscontent="ws_priv +
ws_shareable - ws_shared"></span><span class='k'>k</span>
</td>
<td class='number'>
<span class='th' jscontent="ws_shared"></span><span
class='k'>k</span>
</td>
<td class='number'>
<span class='th' jseval="addToSum('tot_ws_tot', $this.ws_priv +
$this.ws_shareable)" jscontent="ws_priv +
ws_shareable"></span><span class='k'>k</span>
</td>
<td class='number'>
<span class='th' jseval="addToSum('tot_comm_priv', $this.comm_priv)"
jscontent="comm_priv"></span><span class='k'>k</span>
</td>
<td class='number'>
<span class='th' jseval="addToSum('tot_comm_map', $this.comm_map)"
jscontent="comm_map"></span><span class='k'>k</span>
</td>
</tr>
<tr class='total doNotFilter'>
<td class='pid'>
</td>
<td class='name'>
Σ
</td>
<td class='number'>
<span class='th' id="tot_ws_priv">0</span><span class='k'>k</span>
</td>
<td class='number'>
</td>
<td class='number'>
<span class='th' id="tot_ws_tot">0</span><span class='k'>k</span>
</td>
<td class='number'>
<span class='th' id="tot_comm_priv">0</span><span class='k'>k</span>
</td>
<td class='number'>
<div class='help'>
<div>
<p>
This is an approximation. Conceptually, this is the total
amount of in-memory pages for the entire logical
<span jscontent="current_browser_name"></span> application,
without double counting shared pages (e.g. mapped DLLs,
SharedMemory bitmaps, etc.) across the browser and renderers.
</p>
</div>
</div>
<span class='th' id="tot_comm_map">0</span><span class='k'>k</span>
</td>
</tr>
<tr class='noResults'>
<td colspan='99'>
No results found.
</td>
</tr>
</table>
</div>
</body>
<script>
enableHelpTooltips();
</script>
</html>
what this code does different is instead of just displaying the PID it sends the PID to a function we added called hexPID and then displays the results. the PID column also becomes wider due to a change in the css at the top.
as Vexenos pointed out, this template page may change slightly from version to version so here are the specific changes that need to be made.
to make the PID field bigger change this to like 8em, or whatever looks best to your eyes.
table.list .pid {
width: 4em;This next function gets added to the top of the "<script>" section. it takes the pid converts it to hex and returns it
function hexPID(value){
var pid = value + "->hex-> "+value.toString(16);
return pid;
}In the body, atleast one change of the following code to needs to be made. in my version there are 2.
<td class='pid'>
<span class='th' jscontent="pid"></span>
</td>becomes
<td class='pid'>
<span class='th' jscontent="hexPID($this.pid)"></span>
</td>this change simply tells the page to display the output from the function instead of just the PID
to finalize the changes, make sure chrome is not running, then click the compile script button, and then select file | save.
(broken image removed)
run chrome and check about:memory to see the results.
(broken image removed)
