google / WebFundamentals

Former git repo for WebFundamentals on developers.google.com
Apache License 2.0
13.85k stars 2.57k forks source link

Passing budgetPath to Lighthouse's Node module #7849

Open wojtekmaj opened 5 years ago

wojtekmaj commented 5 years ago

Page Affected: https://developers.google.com/web/tools/lighthouse/audits/budgets

What needs to be done?

It's unclear on how to pass budgets into Lighthouse's Node module. I figured that passing budgetPath like so:

const results = await lighthouse(url, {
  budgetPath: '../perf-budget.json',
}));

doesn't work (so I guess documentation is missing something here), but if I provide an budgets like this:

const results = await lighthouse(url, {
  budgets: JSON.parse(fs.readFileSync('../perf-budget.json')),
}));

it kinda works. "Kinda" - meaning I can see the errors if perf-budget.json is invalid (like when I change any resourceType to "blabla" inside it), but passing a valid file here doesn't make any difference to any of the audits. For example, resource-summary still says:

{
  id: 'resource-summary',
  title: 'Keep request counts low and transfer sizes small',
  description: 'To set budgets for the quantity and size of page ' +
    'resources, add a budget.json file. [Learn ' +
    'more](https://developers.google.com/web/tools/lighthouse/audits/budgets).',

Simply creating budget.json as description suggests doesn't work either.

Budget I'm trying to enforce is not a lot different from the one given in your examples:

[
  {
    "resourceSizes": [
      {
        "resourceType": "script",
        "budget": 300
      },
      {
        "resourceType": "image",
        "budget": 100
      },
      {
        "resourceType": "third-party",
        "budget": 0
      },
      {
        "resourceType": "total",
        "budget": 450
      }
    ],
    "resourceCounts": [
      {
        "resourceType": "third-party",
        "budget": 0
      },
      {
        "resourceType": "total",
        "budget": 25
      }
    ]
  }
]
wojtekmaj commented 5 years ago

Follow-up: Passing valid budgets in JSON.parse(fs.readFileSync('../perf-budget.json')) actually works because I see details table with sizeOverBudget value, but doesn't make performance-budget audit to fail.

Macleykun commented 5 years ago

Really look forward seeing this solved, would be great to use google pagespeed to check if my site is still within the budget.json file.