byte-weight-breakdown
Custom audit for Google Lighthouse to provide a byte weight breakdown by resource type.
I think it nicely complements the total-byte-weight audit (i.e. the one with the UI message: 'Avoids enormous network payloads').
Usage
You have to use a custom Lighthouse configuration:
npm install lighthouse byte-weight-breakdown
ligthouse --config-path=config.js https://www.google.comYou can either extend the default (see examples/extends.js) or you can run this audit only (see examples/standalone.js).
Example output
JSON
//...
"audits": {
"byte-weight-breakdown": {
"id": "byte-weight-breakdown",
//...
"details": {
"type": "table",
"headings": [
//...
],
"items": [
{
"type": "Script",
"count": 3,
"totalBytes": 211215
},
{
"type": "Document",
"count": 1,
"totalBytes": 44613
},
//...HTML
See also
csabapalfi/page-weight if you also want to interact with your page with Puppeteer.