Question

如何以编程方式在Google Chrome中获取我的网站的内存使用量（JS和总数）？

我看过使用未记录的HeapProfiler从Chrome扩展程序中执行此操作（请参阅here），但我找不到从中获取数据的方法。

我想测量每次发布时的内存消耗，所以这需要是程序化的。

编辑：我想出了如何使HeapProfiler方法起作用。每个addHeapSnapshotChunk事件都有一个JSON对象的块。

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');
    });
  });
});

解析时，JSON具有关于节点和边缘类型和字段的节点，边和描述性元数据。

或者，如果我只想要总计，我可以使用Timeline个事件。

那就是说，有没有比我在这里发现的更好的方法？

Answer 1

对于将来发现此问题的任何人，从版本20 Chrome开始支持window.performance.memory，其返回类似于：

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

Answer 2

另一种方法：写一个指向此URL的网页抓取器：

铬：//系统/

（注意：如果此网址再次更改，这是列出所有Chrome诊断页面的＆＃39;主网址：chrome：// chrome-urls /

该页面有一个＆＃39; mem_usage＆＃39;这提供了内存使用的详细信息。

也许有一些方法可以将Chrome作为用户（例如在AutoIT或Python？中）编写脚本，在Chrome中加载此网址，然后按下“更新”按钮，然后解析JSON以获取任何标签的内存使用情况有兴趣。

其他方法：

- 使用window.performance
- 使用browser-report.js -

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

Answer 3

chrome dev通道有一个进程api，chrome.process。您可以查询选项卡的进程信息，其中包括各种内存信息。 http://developer.chrome.com/extensions/processes.html

Answer 4

有一个js库：https://github.com/spite/memory-stats.js

Answer 5

仅对此线程进行更新：从chrome 83开始，performance.measureMemory()是获取chrome内存信息的最可靠方法。即使同一堆被多个网页共享，它也可以为我们提供确切的内存信息！您可以在https://web.dev/monitor-total-page-memory-usage/

中找到更多信息。

以编程方式获取Chrome中的内存使用量

5 个答案: