28

如何以编程方式在 Google Chrome 中获取我的网站的内存使用情况(JS 和总计)?

我查看了使用未记录的 HeapProfiler(参见此处)从 Chrome 扩展程序执行此操作,但我找不到从中获取数据的方法。

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

编辑:我想出了如何让 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 包含节点、边以及关于节点和边类型和字段的描述性元数据。

或者,如果我只想要总数,我可以使用时间轴事件。

也就是说,有没有比我在这里发现的更好的方法?

4

5 回答 5

29

对于将来发现此问题的任何人,因为版本 20 Chrome 支持window.performance.memory,它会返回如下内容:

{
  totalJSHeapSize: 21700000,
  usedJSHeapSize: 13400000,
  jsHeapSizeLimit: 1620000000
}
于 2016-05-03T17:45:06.517 回答
11

另一种方法:编写一个指向该 URL 的网页抓取工具:

铬://系统/

(注意:如果此 URL 再次更改,这是列出所有 chrome 诊断页面的“主”URL:chrome://chrome-urls/

该页面有一个“mem_usage”部分,提供了内存使用的详细信息。

也许有某种方法可以将 Chrome 脚本作为用户(比如在 AutoIT 或 Python 中?)在 Chrome 中加载此 URL,然后按更新按钮,然后解析 JSON 以获取您感兴趣的任何选项卡的内存使用情况.


其他方法:

  • 来自 JavaScript - 使用 window.performance

  • 来自 JavaScript - 使用 browser-report.js -

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

于 2013-09-24T12:59:46.267 回答
4

chrome dev 频道有一个进程 api,chrome.process。可以查询一个tab的进程信息,包括各种内存信息。http://developer.chrome.com/extensions/processes.html

于 2014-01-15T19:42:13.220 回答
2

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

于 2015-07-03T00:16:48.817 回答
0

只是这个线程的更新:启动 chrome 83,performance.measureMemory()似乎是在 chrome 上获取内存信息的最可靠方法。即使同一个堆被多个网页共享,它也为我们提供了准确的内存信息!!。您可以在以下位置找到更多信息:https ://web.dev/monitor-total-page-memory-usage/

于 2020-12-08T09:23:23.593 回答