Programmatically get memory usage in Chrome

Question

How can I programmatically get memory usage (JS and total) of my website in Google Chrome?

I looked at doing it from a Chrome extension using the undocumented HeapProfiler (see here), but I can't find a way to get data from that.

I want to measure the memory consumption it at every release, so this needs to be programmatic.

EDIT: I figured out how to get the HeapProfiler method to work. Each addHeapSnapshotChunk event has a chunk of a JSON object.

chrome.browserAction.onClicked.addListener(function(tab) {
  var heapData,
    debugId = {tabId:tab.id};
  chrome.debugger.attach(debugId, '1.0', function() {    
    chrome.debugger.sendCommand(debugId, 'Debugger.enable', {}, function() {
      function headerListener(source, name, data) {
        if(source.tabId == tab.id && name == 'HeapProfiler.addProfileHeader') {
          function chunkListener(source, name, data) {
            if(name == 'HeapProfiler.addHeapSnapshotChunk') {
              heapData += data.chunk;
            } else if(name == 'HeapProfiler.finishHeapSnapshot') {
              chrome.debugger.onEvent.removeListener(chunkListener);
              chrome.debugger.detach(debugId);
              //do something with data
              console.log('Collected ' + heapData.length + ' bytes of JSON data');
            }
          }
          chrome.debugger.onEvent.addListener(chunkListener);
          chrome.debugger.sendCommand(debugId, 'HeapProfiler.getHeapSnapshot', {uid:data.header.uid, type:data.header.typeId});
        }
        chrome.debugger.onEvent.removeListener(headerListener);
      }
      chrome.debugger.onEvent.addListener(headerListener);
      chrome.debugger.sendCommand(debugId, 'HeapProfiler.takeHeapSnapshot');
    });
  });
});

When parsed, the JSON has nodes, edges, and descriptive metadata about the node and edge types and fields.

Alternatively, I could use Timeline events if I just want totals.

That said, are there any better ways than what I've found out here?

I'm not sure how much details do you require, but have you checked the `window.performance` object? It gives a brief overview of memory usage and doesn't require extension to be accessed. — Konrad Dzwinel, Aug 27 '13 at 07:22
I have, specifically `window.performance.memory`. It doesn't seem to match the heap profile, though. I actually don't need a lot of details; the total memory usage would be sufficient. — Paul Draper, Aug 28 '13 at 04:55

score 30 · Answer 1 · answered May 03 '16 at 17:45

30

For anyone that finds this in the future, since version 20 Chrome supports window.performance.memory, which returns something like:

{
  totalJSHeapSize: 21700000,
  usedJSHeapSize: 13400000,
  jsHeapSizeLimit: 1620000000
}

answered May 03 '16 at 17:45

bcherny

3,072
2
27
35

2

I've been trying this out, and the values don't change for me, even before and after creating a 1,000,000+ keys/values object... – mate.gvo Sep 03 '18 at 01:20
try to start Chrome with CLI flag `–-enable-precise-memory-info`. – Pavel Vlasov Apr 11 '19 at 13:12
1

@Pavel Vlasov correct version: --enable-precise-memory-info – David Apr 18 '19 at 15:11
1

Ok, this does work, but you must make sure no chrome.exe process was running before. – David Apr 18 '19 at 15:25
in typescript, you may not find `window.performance.memory`. use `(window.performance as any).memory`. – Mazdak Mar 13 '23 at 07:14

Sean · Answer 2 · 2017-03-06T11:07:46.327

An alternative approach: write a web page scraper pointing to this URL:

chrome://system/

(note: in case this URL changes again, this is the 'master' URL that lists all the chrome diagnostic pages: chrome://chrome-urls/

the page has a section 'mem_usage' that gives details of memory usage.

maybe there is some way to script Chrome as a user (say in AutoIT or Python?) that loads this URL in Chrome, and then presses the Update button, and then parses the JSON to get the memory usage for whatever tabs you are interested in.

OTHER approaches:

from JavaScript - use window.performance
from JavaScript - use browser-report.js -

https://www.npmjs.com/package/browser-report

score 4 · Answer 3 · answered Jan 15 '14 at 19:42

4

The chrome dev channel has a process api, chrome.process. You can query it for a tab's process information, which includes all kinds of memory information. http://developer.chrome.com/extensions/processes.html

answered Jan 15 '14 at 19:42

Brian Schlenker

4,966
6
31
44

1

Is there a way to call this API from outside of the browser? – rakslice Mar 22 '15 at 23:47

score 2 · Answer 4 · answered Jul 03 '15 at 00:16

2

There is a js library for that: https://github.com/spite/memory-stats.js

answered Jul 03 '15 at 00:16

gaitat

12,449
4
52
76

score 0 · Answer 5 · answered Dec 08 '20 at 09:23

0

Just an update on this thread: Starting chrome 83, performance.measureMemory() seems to be most reliable way to get memory information on chrome. It gives us the exact memory information even if the same heap is shared by multiple web pages!!. You can find more info at: https://web.dev/monitor-total-page-memory-usage/

answered Dec 08 '20 at 09:23

kskashyap94

46
5

1

Renamed to `performance.measureUserAgentSpecificMemory` starting with Chrome 89. This feature may not always be enabled by default, see the post's link. – dlauzon Aug 25 '21 at 15:08

Programmatically get memory usage in Chrome

5 Answers5

Linked