lighthouse 11.7.0-dev.20240416 → 11.7.0-dev.20240417

package/cli/bin.js

@@ -79,13 +79,6 @@ async function begin() {
     config = (await import(`../core/config/${cliFlags.preset}-config.js`)).default;
   }
 
-  if (cliFlags.budgetPath) {
-    cliFlags.budgetPath = path.resolve(process.cwd(), cliFlags.budgetPath);
-    /** @type {Array<LH.Budget>} */
-    const parsedBudget = JSON.parse(fs.readFileSync(cliFlags.budgetPath, 'utf8'));
-    cliFlags.budgets = parsedBudget;
-  }
-
   // set logging preferences
   cliFlags.logLevel = 'info';
   if (cliFlags.verbose) {

package/cli/cli-flags.d.ts

@@ -24,7 +24,7 @@ export function getYargsParser(manualArgv?: string | undefined): yargs.Argv<yarg
         default: boolean;
         describe: string;
     };
-}>, "port" | "screenEmulation" | "emulatedUserAgent" | "hostname" | "preset" | "save-assets" | "list-all-audits" | "list-locales" | "list-trace-categories" | "debug-navigation" | "additional-trace-categories" | "config-path" | "chrome-flags" | "form-factor" | "max-wait-for-load" | "enable-error-reporting" | "gather-mode" | "audit-mode" | "only-audits" | "only-categories" | "skip-audits" | "budget-path" | "disable-full-page-screenshot" | "ignore-status-code"> & yargs.InferredOptionTypes<{
+}>, "port" | "screenEmulation" | "emulatedUserAgent" | "hostname" | "preset" | "save-assets" | "list-all-audits" | "list-locales" | "list-trace-categories" | "debug-navigation" | "additional-trace-categories" | "config-path" | "chrome-flags" | "form-factor" | "max-wait-for-load" | "enable-error-reporting" | "gather-mode" | "audit-mode" | "only-audits" | "only-categories" | "skip-audits" | "disable-full-page-screenshot" | "ignore-status-code"> & yargs.InferredOptionTypes<{
     'save-assets': {
         type: "boolean";
         default: boolean;
@@ -125,10 +125,6 @@ export function getYargsParser(manualArgv?: string | undefined): yargs.Argv<yarg
         coerce: typeof splitCommaSeparatedValues;
         describe: string;
     };
-    'budget-path': {
-        type: "string";
-        describe: string;
-    };
     'disable-full-page-screenshot': {
         type: "boolean";
         describe: string;

package/cli/cli-flags.js

@@ -196,10 +196,6 @@ function getYargsParser(manualArgv) {
         coerce: splitCommaSeparatedValues,
         describe: 'Run everything except these audits',
       },
-      'budget-path': {
-        type: 'string',
-        describe: 'The path to the budget.json file for LightWallet.',
-      },
       'disable-full-page-screenshot': {
         type: 'boolean',
         describe: 'Disables collection of the full page screenshot, which can be quite large',
@@ -213,7 +209,7 @@ function getYargsParser(manualArgv) {
       'save-assets', 'list-all-audits', 'list-locales', 'list-trace-categories', 'additional-trace-categories',
       'config-path', 'preset', 'chrome-flags', 'port', 'hostname', 'form-factor', 'screenEmulation', 'emulatedUserAgent',
       'max-wait-for-load', 'enable-error-reporting', 'gather-mode', 'audit-mode',
-      'only-audits', 'only-categories', 'skip-audits', 'budget-path', 'disable-full-page-screenshot', 'ignore-status-code',
+      'only-audits', 'only-categories', 'skip-audits', 'disable-full-page-screenshot', 'ignore-status-code',
     ], 'Configuration:')
 
     // Output

package/cli/test/smokehouse/core-tests.js

@@ -35,7 +35,6 @@ import metricsTrickyTti from './test-definitions/metrics-tricky-tti.js';
 import metricsTrickyTtiLateFcp from './test-definitions/metrics-tricky-tti-late-fcp.js';
 import oopifRequests from './test-definitions/oopif-requests.js';
 import oopifScripts from './test-definitions/oopif-scripts.js';
-import perfBudgets from './test-definitions/perf-budgets.js';
 import perfDebug from './test-definitions/perf-debug.js';
 import perfDiagnosticsAnimations from './test-definitions/perf-diagnostics-animations.js';
 import perfDiagnosticsThirdParty from './test-definitions/perf-diagnostics-third-party.js';
@@ -94,7 +93,6 @@ const smokeTests = [
   metricsTrickyTtiLateFcp,
   oopifRequests,
   oopifScripts,
-  perfBudgets,
   perfDebug,
   perfDiagnosticsAnimations,
   perfDiagnosticsThirdParty,

package/core/audits/byte-efficiency/render-blocking-resources.js

@@ -117,7 +117,8 @@ class RenderBlockingResources extends Audit {
       guidanceLevel: 2,
       // TODO: look into adding an `optionalArtifacts` property that captures the non-required nature
       // of CSSUsage
-      requiredArtifacts: ['URL', 'traces', 'devtoolsLogs', 'CSSUsage', 'GatherContext', 'Stacks'],
+      requiredArtifacts:
+        ['URL', 'traces', 'devtoolsLogs', 'Stylesheets', 'CSSUsage', 'GatherContext', 'Stacks'],
     };
   }
 
@@ -263,6 +264,7 @@ class RenderBlockingResources extends Audit {
     const wastedBytesByUrl = new Map();
     try {
       const unusedCssItems = await UnusedCSS.request({
+        Stylesheets: artifacts.Stylesheets,
         CSSUsage: artifacts.CSSUsage,
         devtoolsLog: artifacts.devtoolsLogs[Audit.DEFAULT_PASS],
       }, context);

package/core/audits/byte-efficiency/unminified-css.js

@@ -37,7 +37,7 @@ class UnminifiedCSS extends ByteEfficiencyAudit {
       description: str_(UIStrings.description),
       scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 3,
-      requiredArtifacts: ['CSSUsage', 'devtoolsLogs', 'traces', 'URL', 'GatherContext'],
+      requiredArtifacts: ['Stylesheets', 'devtoolsLogs', 'traces', 'URL', 'GatherContext'],
     };
   }
 
@@ -85,7 +85,7 @@ class UnminifiedCSS extends ByteEfficiencyAudit {
    */
   static audit_(artifacts, networkRecords) {
     const items = [];
-    for (const stylesheet of artifacts.CSSUsage.stylesheets) {
+    for (const stylesheet of artifacts.Stylesheets) {
       const networkRecord = networkRecords
         .find(record => record.url === stylesheet.header.sourceURL);
       if (!stylesheet.content) continue;

package/core/audits/byte-efficiency/unused-css-rules.js

@@ -34,7 +34,8 @@ class UnusedCSSRules extends ByteEfficiencyAudit {
       description: str_(UIStrings.description),
       scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 1,
-      requiredArtifacts: ['CSSUsage', 'URL', 'devtoolsLogs', 'traces', 'GatherContext'],
+      requiredArtifacts:
+        ['Stylesheets', 'CSSUsage', 'URL', 'devtoolsLogs', 'traces', 'GatherContext'],
     };
   }
 
@@ -46,6 +47,7 @@ class UnusedCSSRules extends ByteEfficiencyAudit {
    */
   static async audit_(artifacts, _, context) {
     const unusedCssItems = await UnusedCSS.request({
+      Stylesheets: artifacts.Stylesheets,
       CSSUsage: artifacts.CSSUsage,
       devtoolsLog: artifacts.devtoolsLogs[ByteEfficiencyAudit.DEFAULT_PASS],
     }, context);

package/core/audits/font-display.js

@@ -50,7 +50,7 @@ class FontDisplay extends Audit {
       description: str_(UIStrings.description),
       supportedModes: ['navigation'],
       guidanceLevel: 3,
-      requiredArtifacts: ['devtoolsLogs', 'CSSUsage', 'URL'],
+      requiredArtifacts: ['devtoolsLogs', 'Stylesheets', 'URL'],
       scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
     };
   }
@@ -67,7 +67,7 @@ class FontDisplay extends Audit {
     const failingURLs = new Set();
 
     // Go through all the stylesheets to find all @font-face declarations
-    for (const stylesheet of artifacts.CSSUsage.stylesheets) {
+    for (const stylesheet of artifacts.Stylesheets) {
       // Eliminate newlines so we can more easily scan through with a regex
       const newlinesStripped = stylesheet.content.replace(/(\r|\n)+/g, ' ');
       // Find the @font-faces

package/core/audits/resource-summary.d.ts

@@ -1,4 +1,6 @@
 export default ResourceSummary;
+export type ResourceType = import('../computed/resource-summary.js').ResourceType;
+/** @typedef {import('../computed/resource-summary.js').ResourceType} ResourceType */
 declare class ResourceSummary extends Audit {
     /**
      * @param {LH.Artifacts} artifacts

package/core/audits/resource-summary.js

@@ -10,6 +10,8 @@ import * as i18n from '../lib/i18n/i18n.js';
 
 const str_ = i18n.createIcuMessageFn(import.meta.url);
 
+/** @typedef {import('../computed/resource-summary.js').ResourceType} ResourceType */
+
 class ResourceSummary extends Audit {
   /**
    * @return {LH.Audit.Meta}
@@ -32,7 +34,7 @@ class ResourceSummary extends Audit {
   static async audit(artifacts, context) {
     const devtoolsLog = artifacts.devtoolsLogs[Audit.DEFAULT_PASS];
     const summary = await ComputedResourceSummary
-      .request({devtoolsLog, URL: artifacts.URL, budgets: context.settings.budgets}, context);
+      .request({devtoolsLog, URL: artifacts.URL}, context);
 
     /** @type {LH.Audit.Details.Table['headings']} */
     const headings = [
@@ -41,8 +43,7 @@ class ResourceSummary extends Audit {
       {key: 'transferSize', valueType: 'bytes', label: str_(i18n.UIStrings.columnTransferSize)},
     ];
 
-
-    /** @type {Record<LH.Budget.ResourceType, LH.IcuMessage>} */
+    /** @type {Record<ResourceType, LH.IcuMessage>} */
     const strMappings = {
       'total': str_(i18n.UIStrings.totalResourceType),
       'document': str_(i18n.UIStrings.documentResourceType),
@@ -55,7 +56,7 @@ class ResourceSummary extends Audit {
       'third-party': str_(i18n.UIStrings.thirdPartyResourceType),
     };
 
-    const types = /** @type {Array<LH.Budget.ResourceType>} */ (Object.keys(summary));
+    const types = /** @type {Array<ResourceType>} */ (Object.keys(summary));
     const rows = types.map(type => {
       return {
         // ResourceType is included as an "id" for ease of use.

package/core/computed/resource-summary.d.ts

@@ -4,42 +4,40 @@ export type ResourceEntry = {
     resourceSize: number;
     transferSize: number;
 };
+export type ResourceType = 'stylesheet' | 'image' | 'media' | 'font' | 'script' | 'document' | 'other' | 'third-party' | 'total';
 declare const ResourceSummaryComputed: typeof ResourceSummary & {
     request: (dependencies: {
         URL: LH.Artifacts['URL'];
         devtoolsLog: import("../index.js").DevtoolsLog;
-        budgets: LH.Util.ImmutableObject<LH.Budget[] | null>;
     }, context: import("../../types/utility-types.js").default.ImmutableObject<{
         computedCache: Map<string, import("../lib/arbitrary-equality-map.js").ArbitraryEqualityMap>;
-    }>) => Promise<Record<import("../../types/lhr/budget.js").default.ResourceType, ResourceEntry>>;
+    }>) => Promise<Record<ResourceType, ResourceEntry>>;
 };
 /** @typedef {{count: number, resourceSize: number, transferSize: number}} ResourceEntry */
+/** @typedef {'stylesheet'|'image'|'media'|'font'|'script'|'document'|'other'|'third-party'|'total'} ResourceType */
 declare class ResourceSummary {
     /**
      * @param {LH.Artifacts.NetworkRequest} record
-     * @return {LH.Budget.ResourceType}
+     * @return {ResourceType}
      */
-    static determineResourceType(record: LH.Artifacts.NetworkRequest): LH.Budget.ResourceType;
+    static determineResourceType(record: LH.Artifacts.NetworkRequest): ResourceType;
     /**
      * @param {Array<LH.Artifacts.NetworkRequest>} networkRecords
      * @param {LH.Artifacts.URL} URLArtifact
-     * @param {LH.Util.ImmutableObject<LH.Budget[]|null>} budgets
      * @param {LH.Artifacts.EntityClassification} classifiedEntities
-     * @return {Record<LH.Budget.ResourceType, ResourceEntry>}
+     * @return {Record<ResourceType, ResourceEntry>}
      */
-    static summarize(networkRecords: Array<LH.Artifacts.NetworkRequest>, URLArtifact: LH.Artifacts.URL, budgets: LH.Util.ImmutableObject<LH.Budget[] | null>, classifiedEntities: LH.Artifacts.EntityClassification): Record<LH.Budget.ResourceType, ResourceEntry>;
+    static summarize(networkRecords: Array<LH.Artifacts.NetworkRequest>, URLArtifact: LH.Artifacts.URL, classifiedEntities: LH.Artifacts.EntityClassification): Record<ResourceType, ResourceEntry>;
     /**
-     * @param {{URL: LH.Artifacts['URL'], devtoolsLog: LH.DevtoolsLog, budgets: LH.Util.ImmutableObject<LH.Budget[]|null>}} data
+     * @param {{URL: LH.Artifacts['URL'], devtoolsLog: LH.DevtoolsLog}} data
      * @param {LH.Artifacts.ComputedContext} context
-     * @return {Promise<Record<LH.Budget.ResourceType,ResourceEntry>>}
+     * @return {Promise<Record<ResourceType,ResourceEntry>>}
      */
     static compute_(data: {
         URL: LH.Artifacts['URL'];
         devtoolsLog: import("../index.js").DevtoolsLog;
-        budgets: LH.Util.ImmutableObject<LH.Budget[] | null>;
-    }, context: LH.Artifacts.ComputedContext): Promise<Record<LH.Budget.ResourceType, ResourceEntry>>;
+    }, context: LH.Artifacts.ComputedContext): Promise<Record<ResourceType, ResourceEntry>>;
 }
-import { Budget } from '../config/budget.js';
 import { NetworkRequest } from '../lib/network-request.js';
 import { EntityClassification } from './entity-classification.js';
 //# sourceMappingURL=resource-summary.d.ts.map

package/core/computed/resource-summary.js

@@ -8,19 +8,19 @@ import {EntityClassification} from './entity-classification.js';
 import {makeComputedArtifact} from './computed-artifact.js';
 import {NetworkRecords} from './network-records.js';
 import {NetworkRequest} from '../lib/network-request.js';
-import {Budget} from '../config/budget.js';
 import UrlUtils from '../lib/url-utils.js';
 
 /** @typedef {{count: number, resourceSize: number, transferSize: number}} ResourceEntry */
+/** @typedef {'stylesheet'|'image'|'media'|'font'|'script'|'document'|'other'|'third-party'|'total'} ResourceType */
 
 class ResourceSummary {
   /**
    * @param {LH.Artifacts.NetworkRequest} record
-   * @return {LH.Budget.ResourceType}
+   * @return {ResourceType}
    */
   static determineResourceType(record) {
     if (!record.resourceType) return 'other';
-    /** @type {Partial<Record<LH.Crdp.Network.ResourceType, LH.Budget.ResourceType>>} */
+    /** @type {Partial<Record<LH.Crdp.Network.ResourceType, ResourceType>>} */
     const requestToResourceType = {
       'Stylesheet': 'stylesheet',
       'Image': 'image',
@@ -35,12 +35,11 @@ class ResourceSummary {
   /**
    * @param {Array<LH.Artifacts.NetworkRequest>} networkRecords
    * @param {LH.Artifacts.URL} URLArtifact
-   * @param {LH.Util.ImmutableObject<LH.Budget[]|null>} budgets
    * @param {LH.Artifacts.EntityClassification} classifiedEntities
-   * @return {Record<LH.Budget.ResourceType, ResourceEntry>}
+   * @return {Record<ResourceType, ResourceEntry>}
    */
-  static summarize(networkRecords, URLArtifact, budgets, classifiedEntities) {
-    /** @type {Record<LH.Budget.ResourceType, ResourceEntry>} */
+  static summarize(networkRecords, URLArtifact, classifiedEntities) {
+    /** @type {Record<ResourceType, ResourceEntry>} */
     const resourceSummary = {
       'stylesheet': {count: 0, resourceSize: 0, transferSize: 0},
       'image': {count: 0, resourceSize: 0, transferSize: 0},
@@ -52,15 +51,9 @@ class ResourceSummary {
       'total': {count: 0, resourceSize: 0, transferSize: 0},
       'third-party': {count: 0, resourceSize: 0, transferSize: 0},
     };
-    const budget = Budget.getMatchingBudget(budgets, URLArtifact.mainDocumentUrl);
     /** @type {ReadonlyArray<string>} */
-    let firstPartyHosts = [];
-    if (budget?.options?.firstPartyHostnames) {
-      firstPartyHosts = budget.options.firstPartyHostnames;
-    } else {
-      firstPartyHosts = classifiedEntities.firstParty?.domains.map(domain => `*.${domain}`) ||
-        [`*.${UrlUtils.getRootDomain(URLArtifact.finalDisplayedUrl)}`];
-    }
+    const firstPartyHosts = classifiedEntities.firstParty?.domains.map(domain => `*.${domain}`) ||
+      [`*.${UrlUtils.getRootDomain(URLArtifact.finalDisplayedUrl)}`];
 
     networkRecords.filter(record => {
       // Ignore favicon.co
@@ -101,18 +94,18 @@ class ResourceSummary {
   }
 
   /**
-   * @param {{URL: LH.Artifacts['URL'], devtoolsLog: LH.DevtoolsLog, budgets: LH.Util.ImmutableObject<LH.Budget[]|null>}} data
+   * @param {{URL: LH.Artifacts['URL'], devtoolsLog: LH.DevtoolsLog}} data
    * @param {LH.Artifacts.ComputedContext} context
-   * @return {Promise<Record<LH.Budget.ResourceType,ResourceEntry>>}
+   * @return {Promise<Record<ResourceType,ResourceEntry>>}
    */
   static async compute_(data, context) {
     const networkRecords = await NetworkRecords.request(data.devtoolsLog, context);
     const classifiedEntities = await EntityClassification.request(
       {URL: data.URL, devtoolsLog: data.devtoolsLog}, context);
-    return ResourceSummary.summarize(networkRecords, data.URL, data.budgets, classifiedEntities);
+    return ResourceSummary.summarize(networkRecords, data.URL, classifiedEntities);
   }
 }
 
 const ResourceSummaryComputed =
-  makeComputedArtifact(ResourceSummary, ['URL', 'devtoolsLog', 'budgets']);
+  makeComputedArtifact(ResourceSummary, ['URL', 'devtoolsLog']);
 export {ResourceSummaryComputed as ResourceSummary};

package/core/computed/unused-css.d.ts

@@ -5,6 +5,7 @@ export type StyleSheetInfo = LH.Artifacts.CSSStyleSheetInfo & {
 };
 declare const UnusedCSSComputed: typeof UnusedCSS & {
     request: (dependencies: {
+        Stylesheets: LH.Artifacts['Stylesheets'];
         CSSUsage: LH.Artifacts['CSSUsage'];
         devtoolsLog: import("../index.js").DevtoolsLog;
     }, context: import("../../types/utility-types.js").default.ImmutableObject<{
@@ -50,11 +51,12 @@ declare class UnusedCSS {
      */
     static mapSheetToResult(stylesheetInfo: StyleSheetInfo): LH.Audit.ByteEfficiencyItem;
     /**
-     * @param {{CSSUsage: LH.Artifacts['CSSUsage'], devtoolsLog: LH.DevtoolsLog}} data
+     * @param {{Stylesheets: LH.Artifacts['Stylesheets'], CSSUsage: LH.Artifacts['CSSUsage'], devtoolsLog: LH.DevtoolsLog}} data
      * @param {LH.Artifacts.ComputedContext} context
      * @return {Promise<LH.Audit.ByteEfficiencyItem[]>}
     */
     static compute_(data: {
+        Stylesheets: LH.Artifacts['Stylesheets'];
         CSSUsage: LH.Artifacts['CSSUsage'];
         devtoolsLog: import("../index.js").DevtoolsLog;
     }, context: LH.Artifacts.ComputedContext): Promise<LH.Audit.ByteEfficiencyItem[]>;

package/core/computed/unused-css.js

@@ -134,15 +134,15 @@ class UnusedCSS {
   }
 
   /**
-   * @param {{CSSUsage: LH.Artifacts['CSSUsage'], devtoolsLog: LH.DevtoolsLog}} data
+   * @param {{Stylesheets: LH.Artifacts['Stylesheets'], CSSUsage: LH.Artifacts['CSSUsage'], devtoolsLog: LH.DevtoolsLog}} data
    * @param {LH.Artifacts.ComputedContext} context
    * @return {Promise<LH.Audit.ByteEfficiencyItem[]>}
   */
   static async compute_(data, context) {
-    const {CSSUsage, devtoolsLog} = data;
+    const {CSSUsage, Stylesheets, devtoolsLog} = data;
     const networkRecords = await NetworkRecords.request(devtoolsLog, context);
-    const indexedSheets = UnusedCSS.indexStylesheetsById(CSSUsage.stylesheets, networkRecords);
-    UnusedCSS.indexUsedRules(CSSUsage.rules, indexedSheets);
+    const indexedSheets = UnusedCSS.indexStylesheetsById(Stylesheets, networkRecords);
+    UnusedCSS.indexUsedRules(CSSUsage, indexedSheets);
 
     const items = Object.keys(indexedSheets)
       .map(sheetId => UnusedCSS.mapSheetToResult(indexedSheets[sheetId]));
@@ -150,5 +150,6 @@ class UnusedCSS {
   }
 }
 
-const UnusedCSSComputed = makeComputedArtifact(UnusedCSS, ['CSSUsage', 'devtoolsLog']);
+const UnusedCSSComputed = makeComputedArtifact(UnusedCSS,
+  ['Stylesheets', 'CSSUsage', 'devtoolsLog']);
 export {UnusedCSSComputed as UnusedCSS};

package/core/config/config-helpers.js

@@ -11,7 +11,6 @@ import url from 'url';
 import isDeepEqual from 'lodash/isEqual.js';
 
 import * as constants from './constants.js';
-import {Budget} from './budget.js';
 import ConfigPlugin from './config-plugin.js';
 import {Runner} from '../runner.js';
 import * as i18n from '../lib/i18n/i18n.js';
@@ -347,9 +346,6 @@ function resolveSettings(settingsJson = {}, overrides = undefined) {
     true
   );
 
-  if (settingsWithFlags.budgets) {
-    settingsWithFlags.budgets = Budget.initializeBudget(settingsWithFlags.budgets);
-  }
   // Locale is special and comes only from flags/settings/lookupLocale.
   settingsWithFlags.locale = locale;
 

package/core/config/constants.js

@@ -118,7 +118,6 @@ const defaultSettings = {
 
   // the following settings have no defaults but we still want ensure that `key in settings`
   // in config will work in a typechecked way
-  budgets: null,
   locale: 'en-US', // actual default determined by Config using lib/i18n
   blockedUrlPatterns: null,
   additionalTraceCategories: null,

package/core/config/default-config.js

@@ -13,10 +13,6 @@ import * as i18n from '../lib/i18n/i18n.js';
 const UIStrings = {
   /** Title of the Performance category of audits. Equivalent to 'Web performance', this term is inclusive of all web page speed and loading optimization topics. Also used as a label of a score gauge; try to limit to 20 characters. */
   performanceCategoryTitle: 'Performance',
-  /** Title of the Budgets section of the Performance Category. 'Budgets' refers to a budget (like a financial budget), but applied to the amount of resources on a page, rather than money. */
-  budgetsGroupTitle: 'Budgets',
-  /** Description of the Budgets section of the Performance category. Within this section the budget results are displayed. */
-  budgetsGroupDescription: 'Performance budgets set standards for the performance of your site.',
   /** Title of the speed metrics section of the Performance category. Within this section are various speed metrics which quantify the pageload performance into values presented in seconds and milliseconds. */
   metricGroupTitle: 'Metrics',
   /** Title of an opportunity sub-section of the Performance category. Within this section are audits with imperative titles that suggest actions the user can take to improve the time of the first initial render of the webpage. */
@@ -136,6 +132,7 @@ const defaultConfig = {
     {id: 'Scripts', gatherer: 'scripts'},
     {id: 'SourceMaps', gatherer: 'source-maps'},
     {id: 'Stacks', gatherer: 'stacks'},
+    {id: 'Stylesheets', gatherer: 'stylesheets'},
     {id: 'TraceElements', gatherer: 'trace-elements'},
     {id: 'ViewportDimensions', gatherer: 'viewport-dimensions'},
 
@@ -183,8 +180,6 @@ const defaultConfig = {
     'network-server-latency',
     'main-thread-tasks',
     'metrics',
-    'performance-budget',
-    'timing-budget',
     'resource-summary',
     'third-party-summary',
     'third-party-facades',
@@ -312,10 +307,6 @@ const defaultConfig = {
     'metrics': {
       title: str_(UIStrings.metricGroupTitle),
     },
-    'budgets': {
-      title: str_(UIStrings.budgetsGroupTitle),
-      description: str_(UIStrings.budgetsGroupDescription),
-    },
     'diagnostics': {
       title: str_(UIStrings.diagnosticsGroupTitle),
       description: str_(UIStrings.diagnosticsGroupDescription),
@@ -437,10 +428,6 @@ const defaultConfig = {
         {id: 'work-during-interaction', weight: 0, group: 'diagnostics'},
         {id: 'bf-cache', weight: 0, group: 'diagnostics'},
 
-        // Budget audits.
-        {id: 'performance-budget', weight: 0, group: 'budgets'},
-        {id: 'timing-budget', weight: 0, group: 'budgets'},
-
         // Audits past this point contain useful data but are not displayed with other audits.
         {id: 'network-requests', weight: 0, group: 'hidden'},
         {id: 'network-rtt', weight: 0, group: 'hidden'},

package/core/gather/gatherers/css-usage.d.ts

@@ -1,26 +1,5 @@
 export default CSSUsage;
 declare class CSSUsage extends BaseGatherer {
-    /** @type {LH.Gatherer.ProtocolSession|undefined} */
-    _session: LH.Gatherer.ProtocolSession | undefined;
-    /** @type {Map<string, Promise<LH.Artifacts.CSSStyleSheetInfo|Error>>} */
-    _sheetPromises: Map<string, Promise<LH.Artifacts.CSSStyleSheetInfo | Error>>;
-    /**
-     * Initialize as undefined so we can assert results are fetched.
-     * @type {LH.Crdp.CSS.RuleUsage[]|undefined}
-     */
-    _ruleUsage: LH.Crdp.CSS.RuleUsage[] | undefined;
-    /**
-     * @param {LH.Crdp.CSS.StyleSheetAddedEvent} event
-     */
-    _onStylesheetAdded(event: LH.Crdp.CSS.StyleSheetAddedEvent): void;
-    /**
-     * @param {LH.Gatherer.Context} context
-     */
-    startInstrumentation(context: LH.Gatherer.Context): Promise<void>;
-    /**
-     * @param {LH.Gatherer.Context} context
-     */
-    stopInstrumentation(context: LH.Gatherer.Context): Promise<void>;
     /**
      * @param {LH.Gatherer.Context} context
      * @return {Promise<LH.Artifacts['CSSUsage']>}

package/core/gather/gatherers/css-usage.js

@@ -8,145 +8,35 @@
  * @fileoverview Tracks unused CSS rules.
  */
 
-import log from 'lighthouse-logger';
-
 import BaseGatherer from '../base-gatherer.js';
-import {Sentry} from '../../lib/sentry.js';
 
 class CSSUsage extends BaseGatherer {
-  constructor() {
-    super();
-    /** @type {LH.Gatherer.ProtocolSession|undefined} */
-    this._session = undefined;
-    /** @type {Map<string, Promise<LH.Artifacts.CSSStyleSheetInfo|Error>>} */
-    this._sheetPromises = new Map();
-    /**
-     * Initialize as undefined so we can assert results are fetched.
-     * @type {LH.Crdp.CSS.RuleUsage[]|undefined}
-     */
-    this._ruleUsage = undefined;
-    this._onStylesheetAdded = this._onStylesheetAdded.bind(this);
-  }
-
   /** @type {LH.Gatherer.GathererMeta} */
   meta = {
-    supportedModes: ['snapshot', 'timespan', 'navigation'],
+    supportedModes: ['snapshot', 'navigation'],
   };
 
-  /**
-   * @param {LH.Crdp.CSS.StyleSheetAddedEvent} event
-   */
-  _onStylesheetAdded(event) {
-    if (!this._session) throw new Error('Session not initialized');
-    const styleSheetId = event.header.styleSheetId;
-    const sheetPromise = this._session.sendCommand('CSS.getStyleSheetText', {styleSheetId})
-      .then(content => ({
-        header: event.header,
-        content: content.text,
-      }))
-      .catch(/** @param {Error} err */ (err) => {
-        log.warn(
-          'CSSUsage',
-          `Error fetching content of stylesheet with URL "${event.header.sourceURL}"`
-        );
-        Sentry.captureException(err, {
-          tags: {
-            gatherer: 'CSSUsage',
-          },
-          extra: {
-            url: event.header.sourceURL,
-          },
-          level: 'error',
-        });
-        return err;
-      });
-    this._sheetPromises.set(styleSheetId, sheetPromise);
-  }
-
   /**
    * @param {LH.Gatherer.Context} context
+   * @return {Promise<LH.Artifacts['CSSUsage']>}
    */
-  async startInstrumentation(context) {
+  async getArtifact(context) {
     const session = context.driver.defaultSession;
-    this._session = session;
-
-    // Calling `CSS.enable` will emit events for stylesheets currently on the page.
-    // We want to ignore these events in navigation mode because they are not relevant to the
-    // navigation that is about to happen. Adding the event listener *after* calling `CSS.enable`
-    // ensures that the events for pre-existing stylesheets are ignored.
-    const isNavigation = context.gatherMode === 'navigation';
-    if (!isNavigation) {
-      session.on('CSS.styleSheetAdded', this._onStylesheetAdded);
-    }
+    const executionContext = context.driver.executionContext;
 
     await session.sendCommand('DOM.enable');
     await session.sendCommand('CSS.enable');
     await session.sendCommand('CSS.startRuleUsageTracking');
 
-    if (isNavigation) {
-      session.on('CSS.styleSheetAdded', this._onStylesheetAdded);
-    }
-  }
-
-
-  /**
-   * @param {LH.Gatherer.Context} context
-   */
-  async stopInstrumentation(context) {
-    const session = context.driver.defaultSession;
-    const coverageResponse = await session.sendCommand('CSS.stopRuleUsageTracking');
-    this._ruleUsage = coverageResponse.ruleUsage;
-    session.off('CSS.styleSheetAdded', this._onStylesheetAdded);
-
-    // Ensure we finish fetching all stylesheet contents before disabling the CSS domain
-    await Promise.all(this._sheetPromises.values());
+    // Force style to recompute.
+    // Doesn't appear to be necessary in newer versions of Chrome.
+    await executionContext.evaluateAsync('getComputedStyle(document.body)');
 
+    const {ruleUsage} = await session.sendCommand('CSS.stopRuleUsageTracking');
     await session.sendCommand('CSS.disable');
     await session.sendCommand('DOM.disable');
-  }
-
-  /**
-   * @param {LH.Gatherer.Context} context
-   * @return {Promise<LH.Artifacts['CSSUsage']>}
-   */
-  async getArtifact(context) {
-    const executionContext = context.driver.executionContext;
-
-    if (context.gatherMode === 'snapshot') {
-      await this.startInstrumentation(context);
-
-      // Force style to recompute.
-      // Doesn't appear to be necessary in newer versions of Chrome.
-      await executionContext.evaluateAsync('getComputedStyle(document.body)');
-
-      await this.stopInstrumentation(context);
-    }
-
-    /** @type {Map<string, LH.Artifacts.CSSStyleSheetInfo>} */
-    const dedupedStylesheets = new Map();
-    const sheets = await Promise.all(this._sheetPromises.values());
-
-    for (const sheet of sheets) {
-      // Erroneous sheets will be reported via sentry and the log.
-      // We can ignore them here without throwing a fatal error.
-      if (sheet instanceof Error) {
-        continue;
-      }
-
-      // Exclude empty stylesheets.
-      if (sheet.header.length === 0) {
-        continue;
-      }
-
-      dedupedStylesheets.set(sheet.content, sheet);
-    }
-
-    if (!this._ruleUsage) throw new Error('Issue collecting rule usages');
 
-    return {
-      rules: this._ruleUsage,
-      stylesheets: Array.from(dedupedStylesheets.values()),
-    };
+    return ruleUsage;
   }
 }