Disable throttling programmatically

[EvilKarter]

Hi I am trying to use lighthouse together with puppeteer. I want to deactivate throttling completely.

It is explained how this works on the CLI but I have not found anything to solve this differently in Node. So I have adopted the solution from the CLI.

However, the output of the configSettings in the result confuses me.
The throttling is still there. Is this normal or am I doing something wrong?

Here my test file

(async () => {
  const puppeteer = await import('puppeteer');
  const lighthouse = await import('lighthouse');
  // Use Puppeteer to launch headless Chrome see https://github.com/GoogleChrome/lighthouse/blob/main/docs/puppeteer.md
  // - Omit `--enable-automation` (See https://github.com/GoogleChrome/lighthouse/issues/12988)
  // - Don't use 800x600 default viewport
  const browser = await puppeteer.launch({
    // Set to false if you want to see the script in action.
    headless: 'new',
    defaultViewport: null,
    ignoreDefaultArgs: ['--enable-automation']
  });

  try {
    const page = await browser.newPage();
    await page.setViewport({
      width: 375,
      height: 800,
      deviceScaleFactor: 2,
      isMobile: true,
    });
    await page.setUserAgent('My Custom User Agent');
    const url = 'https://www.google.com';

    await page.goto(url);
    const lighthouseFlags = {
      port: new URL(browser.wsEndpoint()).port,
    };

    const lighthouseConfig = {
      // extends property only supports extension of lighthouse:default see https://github.com/GoogleChrome/lighthouse/blob/main/docs/configuration.md#config-extension
      extends: 'lighthouse:default',
      settings: {
        output: 'json',
        locale: 'en-US',
        onlyCategories: ['accessibility'],
        disableFullPageScreenshot: true,
        // Disable device emulation and all throttling after example from see https://github.com/GoogleChrome/lighthouse/blob/main/readme.md#cli-options
        throttlingMethod: 'provided',
        screenEmulation: {
          disabled: true
        },
        emulatedUserAgent: false,
        // see https://github.com/GoogleChrome/lighthouse/blob/main/docs/configuration.md#more-examples
        skipAudits: [
          // There are always bf-cache failures when testing in headless. Reenable when headless can give us realistic bf-cache insights.
          'bf-cache',
        ],
      },
    };
    const runnerResult = await lighthouse.default(url, lighthouseFlags, lighthouseConfig, page);
    process.stdout.write(JSON.stringify(runnerResult.lhr.configSettings));
  } catch (e) {
    process.stdout.write(e.message);
  }
  await browser.close();
})();

here the config Settings output

{
  "output": "json",
  "maxWaitForFcp": 30000,
  "maxWaitForLoad": 45000,
  "pauseAfterFcpMs": 5250,
  "pauseAfterLoadMs": 5250,
  "networkQuietThresholdMs": 5250,
  "cpuQuietThresholdMs": 5250,
  "formFactor": "mobile",
  "throttling": {
    "rttMs": 150,
    "throughputKbps": 1638.4,
    "requestLatencyMs": 562.5,
    "downloadThroughputKbps": 1474.5600000000002,
    "uploadThroughputKbps": 675,
    "cpuSlowdownMultiplier": 4
  },
  "throttlingMethod": "provided",
  "screenEmulation": {
    "mobile": true,
    "width": 412,
    "height": 823,
    "deviceScaleFactor": 1.75,
    "disabled": true
  },
  "emulatedUserAgent": false,
  "auditMode": false,
  "gatherMode": false,
  "clearStorageTypes": [
    "file_systems",
    "shader_cache",
    "service_workers",
    "cache_storage"
  ],
  "disableStorageReset": false,
  "debugNavigation": false,
  "channel": "node",
  "usePassiveGathering": false,
  "disableFullPageScreenshot": true,
  "skipAboutBlank": false,
  "blankPage": "about:  blank",
  "ignoreStatusCode": false,
  "budgets": null,
  "locale": "en-US",
  "blockedUrlPatterns": null,
  "additionalTraceCategories": null,
  "extraHeaders": null,
  "precomputedLanternData": null,
  "onlyAudits": null,
  "onlyCategories": [
    "accessibility"
  ],
  "skipAudits": [
    "bf-cache"
  ]
}

[adamraine]

throttlingMethod: 'provided' should remove all throttling like you want.

What do you mean by "The throttling is still there"?

[EvilKarter]

Hi adamraine,
I am wondering why in the configSettings section of the LHR the throttling is still listed with details.

"throttling": {
    "rttMs": 150,
    "throughputKbps": 1638.4,
    "requestLatencyMs": 562.5,
    "downloadThroughputKbps": 1474.5600000000002,
    "uploadThroughputKbps": 675,
    "cpuSlowdownMultiplier": 4
  },
  "throttlingMethod": "provided",

Maybe I'm missing something, but how can I tell from the result alone whether the throttling was provided with or without further details if the throttling is always output in the result?

Because if I pass throttlingMethod provided and also set the rttMs to 10, I see the same thing in the result except for the rttMs value I set.
test script:

 throttlingMethod: 'provided',
 throttling: {
    "rttMs": 10
 },

result:

"throttling": {
    "rttMs": 10,
    "throughputKbps": 1638.4,
    "requestLatencyMs": 562.5,
    "downloadThroughputKbps": 1474.5600000000002,
    "uploadThroughputKbps": 675,
    "cpuSlowdownMultiplier": 4
  },
  "throttlingMethod": "provided",

[adamraine]

The parameters are ignored by Lighthouse when throttlingMethod: 'provided' is set. They still appear in the JSON and you can adjust there value, but they don't affect the page load.

[SivasubramanianV]

@adamraine which throttling replicates a real world performance view. Provided or simulated or packet? And also can you please explain why. Also what kind of cpu throttling should we set?

[adamraine]

@SivasubramanianV please see our throttling documentation the trade-offs of different throttling methods.

[SivasubramanianV]

@adamraine thanks..i read it but there is no mention of 'provided' setting. It only explains packet setting which is a particular machines setting-not sure how that could be an indicator of performance overall as network speed and device speed may vary widely. Also I would like to understand which is ideal as its tough to decide between provided and simulated. So far we have been using simulated and the scores are low so my team is planning to use provided, would that be a right approach. Or i would atleast like to know across industry what is used as a practice.

[adamraine]

Also I would like to understand which is ideal as its tough to decide between provided and simulated. So far we have been using simulated and the scores are low so my team is planning to use provided, would that be a right approach.

provided just means Lighthouse will not add any throttling to the page automatically. Lighthouse will just inherit the network and CPU conditions and of your system, so if there is throttling set up system-wide then it will still affect the Lighthouse result. You should only use provided throttling if you plan to manually set up the throttling environment yourself.

Also I would like to understand which is ideal as there is no clear better method suggested.

There isn't really a a single "ideal" approach, but packet-level throttling tends to be the most accurate. The trade-off is that it can introduce more variance and typically needs to be set up at the system level.