lighthouse 11.1.0-dev.20231003 → 11.1.0-dev.20231004

package/core/audits/audit.js

@@ -49,6 +49,7 @@ class Audit {
   static get SCORING_MODES() {
     return {
       NUMERIC: 'numeric',
+      METRIC_SAVINGS: 'metricSavings',
       BINARY: 'binary',
       MANUAL: 'manual',
       INFORMATIVE: 'informative',
@@ -321,7 +322,8 @@ class Audit {
    */
   static _normalizeAuditScore(score, scoreDisplayMode, auditId) {
     if (scoreDisplayMode !== Audit.SCORING_MODES.BINARY &&
-        scoreDisplayMode !== Audit.SCORING_MODES.NUMERIC) {
+        scoreDisplayMode !== Audit.SCORING_MODES.NUMERIC &&
+        scoreDisplayMode !== Audit.SCORING_MODES.METRIC_SAVINGS) {
       return null;
     }
 
@@ -363,6 +365,7 @@ class Audit {
 
     // Default to binary scoring.
     let scoreDisplayMode = audit.meta.scoreDisplayMode || Audit.SCORING_MODES.BINARY;
+    let score = product.score;
 
     // But override if product contents require it.
     if (product.errorMessage !== undefined) {
@@ -371,9 +374,21 @@ class Audit {
     } else if (product.notApplicable) {
       // Audit was determined to not apply to the page.
       scoreDisplayMode = Audit.SCORING_MODES.NOT_APPLICABLE;
+    } else if (product.scoreDisplayMode) {
+      scoreDisplayMode = product.scoreDisplayMode;
     }
 
-    const score = Audit._normalizeAuditScore(product.score, scoreDisplayMode, audit.meta.id);
+    if (scoreDisplayMode === Audit.SCORING_MODES.METRIC_SAVINGS) {
+      if (score && score >= Util.PASS_THRESHOLD) {
+        score = 1;
+      } else if (Object.values(product.metricSavings || {}).some(v => v)) {
+        score = 0;
+      } else {
+        score = 0.5;
+      }
+    }
+
+    score = Audit._normalizeAuditScore(score, scoreDisplayMode, audit.meta.id);
 
     let auditTitle = audit.meta.title;
     if (audit.meta.failureTitle) {

package/core/audits/bf-cache.js

@@ -61,6 +61,7 @@ class BFCache extends Audit {
       supportedModes: ['navigation', 'timespan'],
       guidanceLevel: 2,
       requiredArtifacts: ['BFCacheFailures'],
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
     };
   }
 

package/core/audits/bootup-time.js

@@ -14,6 +14,7 @@ import {MainThreadTasks} from '../computed/main-thread-tasks.js';
 import {getExecutionTimingsByURL} from '../lib/tracehouse/task-summary.js';
 import {TBTImpactTasks} from '../computed/tbt-impact-tasks.js';
 import {Sentry} from '../lib/sentry.js';
+import {Util} from '../../shared/util.js';
 
 const UIStrings = {
   /** Title of a diagnostic audit that provides detail on the time spent executing javascript files during the load. This descriptive title is shown to users when the amount is acceptable and no user action is required. */
@@ -47,7 +48,7 @@ class BootupTime extends Audit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      scoreDisplayMode: Audit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 1,
       requiredArtifacts: ['traces', 'devtoolsLogs', 'URL', 'GatherContext'],
     };
@@ -169,6 +170,8 @@ class BootupTime extends Audit {
 
     return {
       score,
+      scoreDisplayMode: score >= Util.PASS_THRESHOLD ? Audit.SCORING_MODES.INFORMATIVE : undefined,
+      notApplicable: !results.length,
       numericValue: totalBootupTime,
       numericUnit: 'millisecond',
       displayValue: totalBootupTime > 0 ?

package/core/audits/byte-efficiency/byte-efficiency-audit.js

@@ -309,7 +309,7 @@ class ByteEfficiencyAudit extends Audit {
       displayValue,
       numericValue: wastedMs,
       numericUnit: 'millisecond',
-      score: ByteEfficiencyAudit.scoreForWastedMs(wastedMs),
+      score: results.length ? 0 : 1,
       details,
       metricSavings,
     };

package/core/audits/byte-efficiency/duplicated-javascript.js

@@ -46,7 +46,7 @@ class DuplicatedJavascript extends ByteEfficiencyAudit {
       id: 'duplicated-javascript',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 2,
       requiredArtifacts: ['devtoolsLogs', 'traces', 'SourceMaps', 'Scripts',
         'GatherContext', 'URL'],

package/core/audits/byte-efficiency/efficient-animated-content.js

@@ -36,7 +36,7 @@ class EfficientAnimatedContent extends ByteEfficiencyAudit {
       id: 'efficient-animated-content',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 3,
       requiredArtifacts: ['devtoolsLogs', 'traces', 'GatherContext', 'URL'],
     };

package/core/audits/byte-efficiency/legacy-javascript.js

@@ -115,7 +115,7 @@ class LegacyJavascript extends ByteEfficiencyAudit {
   static get meta() {
     return {
       id: 'legacy-javascript',
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       description: str_(UIStrings.description),
       title: str_(UIStrings.title),
       guidanceLevel: 2,

package/core/audits/byte-efficiency/modern-image-formats.js

@@ -34,7 +34,7 @@ class ModernImageFormats extends ByteEfficiencyAudit {
       id: 'modern-image-formats',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 3,
       requiredArtifacts: ['OptimizedImages', 'devtoolsLogs', 'traces', 'URL', 'GatherContext',
         'ImageElements'],

package/core/audits/byte-efficiency/offscreen-images.js

@@ -48,7 +48,7 @@ class OffscreenImages extends ByteEfficiencyAudit {
       id: 'offscreen-images',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       supportedModes: ['navigation'],
       guidanceLevel: 2,
       requiredArtifacts: ['ImageElements', 'ViewportDimensions', 'GatherContext', 'devtoolsLogs',

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

@@ -12,7 +12,6 @@
 import {Audit} from '../audit.js';
 import * as i18n from '../../lib/i18n/i18n.js';
 import {BaseNode} from '../../lib/dependency-graph/base-node.js';
-import {ByteEfficiencyAudit} from './byte-efficiency-audit.js';
 import {UnusedCSS} from '../../computed/unused-css.js';
 import {NetworkRequest} from '../../lib/network-request.js';
 import {ProcessedNavigation} from '../../computed/processed-navigation.js';
@@ -113,7 +112,7 @@ class RenderBlockingResources extends Audit {
       id: 'render-blocking-resources',
       title: str_(UIStrings.title),
       supportedModes: ['navigation'],
-      scoreDisplayMode: Audit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       description: str_(UIStrings.description),
       guidanceLevel: 2,
       // TODO: look into adding an `optionalArtifacts` property that captures the non-required nature
@@ -296,7 +295,7 @@ class RenderBlockingResources extends Audit {
 
     return {
       displayValue,
-      score: ByteEfficiencyAudit.scoreForWastedMs(wastedMs),
+      score: results.length ? 0 : 1,
       numericValue: wastedMs,
       numericUnit: 'millisecond',
       details,

package/core/audits/byte-efficiency/total-byte-weight.js

@@ -8,6 +8,7 @@ import {Audit} from '../audit.js';
 import * as i18n from '../../lib/i18n/i18n.js';
 import {NetworkRequest} from '../../lib/network-request.js';
 import {NetworkRecords} from '../../computed/network-records.js';
+import {Util} from '../../../shared/util.js';
 
 const UIStrings = {
   /** Title of a diagnostic audit that provides detail on large network resources required during page load. 'Payloads' is roughly equivalent to 'resources'. This descriptive title is shown to users when the amount is acceptable and no user action is required. */
@@ -34,7 +35,7 @@ class TotalByteWeight extends Audit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      scoreDisplayMode: Audit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 1,
       requiredArtifacts: ['devtoolsLogs'],
     };
@@ -98,6 +99,7 @@ class TotalByteWeight extends Audit {
 
     return {
       score,
+      scoreDisplayMode: score >= Util.PASS_THRESHOLD ? Audit.SCORING_MODES.INFORMATIVE : undefined,
       numericValue: totalBytes,
       numericUnit: 'byte',
       displayValue: str_(UIStrings.displayValue, {totalBytes}),

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

@@ -34,7 +34,7 @@ class UnminifiedCSS extends ByteEfficiencyAudit {
       id: 'unminified-css',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 3,
       requiredArtifacts: ['CSSUsage', 'devtoolsLogs', 'traces', 'URL', 'GatherContext'],
     };

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

@@ -42,7 +42,7 @@ class UnminifiedJavaScript extends ByteEfficiencyAudit {
       id: 'unminified-javascript',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 3,
       requiredArtifacts: ['Scripts', 'devtoolsLogs', 'traces', 'GatherContext', 'URL'],
     };

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

@@ -32,7 +32,7 @@ class UnusedCSSRules extends ByteEfficiencyAudit {
       id: 'unused-css-rules',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 2,
       requiredArtifacts: ['CSSUsage', 'URL', 'devtoolsLogs', 'traces', 'GatherContext'],
     };

package/core/audits/byte-efficiency/unused-javascript.js

@@ -66,7 +66,7 @@ class UnusedJavaScript extends ByteEfficiencyAudit {
       id: 'unused-javascript',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 2,
       requiredArtifacts: ['JsUsage', 'Scripts', 'SourceMaps', 'GatherContext',
         'devtoolsLogs', 'traces', 'URL'],

package/core/audits/byte-efficiency/uses-long-cache-ttl.js

@@ -44,7 +44,7 @@ class CacheHeaders extends Audit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      scoreDisplayMode: Audit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 3,
       requiredArtifacts: ['devtoolsLogs'],
     };
@@ -266,11 +266,6 @@ class CacheHeaders extends Audit {
         a.url.localeCompare(b.url);
     });
 
-    const score = Audit.computeLogNormalScore(
-      {p10: context.options.p10, median: context.options.median},
-      totalWastedBytes
-    );
-
     /** @type {LH.Audit.Details.Table['headings']} */
     const headings = [
       {key: 'url', valueType: 'url', label: str_(i18n.UIStrings.columnURL)},
@@ -285,7 +280,7 @@ class CacheHeaders extends Audit {
       {wastedBytes: totalWastedBytes, sortedBy: ['totalBytes'], skipSumming: ['cacheLifetimeMs']});
 
     return {
-      score,
+      score: results.length ? 0 : 1,
       numericValue: totalWastedBytes,
       numericUnit: 'byte',
       displayValue: str_(UIStrings.displayValue, {itemCount: results.length}),

package/core/audits/byte-efficiency/uses-optimized-images.js

@@ -34,7 +34,7 @@ class UsesOptimizedImages extends ByteEfficiencyAudit {
       id: 'uses-optimized-images',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 2,
       requiredArtifacts: ['OptimizedImages', 'ImageElements', 'GatherContext', 'devtoolsLogs',
         'traces', 'URL'],

package/core/audits/byte-efficiency/uses-responsive-images-snapshot.js

@@ -42,6 +42,7 @@ class UsesResponsiveImagesSnapshot extends Audit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: UsesResponsiveImages.str_(UsesResponsiveImages.UIStrings.description),
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       supportedModes: ['snapshot'],
       guidanceLevel: 2,
       requiredArtifacts: ['ImageElements', 'ViewportDimensions'],

package/core/audits/byte-efficiency/uses-responsive-images.js

@@ -45,7 +45,7 @@ class UsesResponsiveImages extends ByteEfficiencyAudit {
       id: 'uses-responsive-images',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 2,
       requiredArtifacts: ['ImageElements', 'ViewportDimensions', 'GatherContext',
         'devtoolsLogs', 'traces', 'URL'],

package/core/audits/byte-efficiency/uses-text-compression.js

@@ -36,7 +36,7 @@ class ResponsesAreCompressed extends ByteEfficiencyAudit {
       id: 'uses-text-compression',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 3,
       requiredArtifacts: ['ResponseCompression', 'GatherContext', 'devtoolsLogs', 'traces', 'URL'],
     };

package/core/audits/dobetterweb/dom-size.js

@@ -14,6 +14,7 @@
 import {Audit} from '../audit.js';
 import * as i18n from '../../lib/i18n/i18n.js';
 import {TBTImpactTasks} from '../../computed/tbt-impact-tasks.js';
+import {Util} from '../../../shared/util.js';
 
 const UIStrings = {
   /** Title of a diagnostic audit that provides detail on the size of the web page's DOM. The size of a DOM is characterized by the total number of DOM elements and greatest DOM depth. This descriptive title is shown to users when the amount is acceptable and no user action is required. */
@@ -53,7 +54,7 @@ class DOMSize extends Audit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      scoreDisplayMode: Audit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 1,
       requiredArtifacts: ['DOMStats', 'URL', 'GatherContext'],
       __internalOptionalArtifacts: ['traces', 'devtoolsLogs'],
@@ -167,6 +168,7 @@ class DOMSize extends Audit {
 
     return {
       score,
+      scoreDisplayMode: score >= Util.PASS_THRESHOLD ? Audit.SCORING_MODES.INFORMATIVE : undefined,
       numericValue: stats.totalBodyElements,
       numericUnit: 'element',
       displayValue: str_(UIStrings.displayValue, {itemCount: stats.totalBodyElements}),

package/core/audits/dobetterweb/no-document-write.js

@@ -55,6 +55,7 @@ class NoDocWriteAudit extends ViolationAudit {
       description: str_(UIStrings.description),
       guidanceLevel: 2,
       requiredArtifacts: ['ConsoleMessages', 'SourceMaps', 'Scripts'],
+      scoreDisplayMode: ViolationAudit.SCORING_MODES.METRIC_SAVINGS,
     };
   }
 

package/core/audits/dobetterweb/uses-http2.js

@@ -15,7 +15,6 @@
 import {Audit} from '../audit.js';
 import {EntityClassification} from '../../computed/entity-classification.js';
 import UrlUtils from '../../lib/url-utils.js';
-import {ByteEfficiencyAudit} from '../byte-efficiency/byte-efficiency-audit.js';
 import {LanternInteractive} from '../../computed/metrics/lantern-interactive.js';
 import {NetworkRequest} from '../../lib/network-request.js';
 import {NetworkRecords} from '../../computed/network-records.js';
@@ -61,7 +60,7 @@ class UsesHTTP2Audit extends Audit {
       id: 'uses-http2',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: Audit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 3,
       supportedModes: ['timespan', 'navigation'],
       requiredArtifacts: ['URL', 'devtoolsLogs', 'traces', 'GatherContext'],
@@ -300,7 +299,7 @@ class UsesHTTP2Audit extends Audit {
       displayValue,
       numericValue: wastedMsTti,
       numericUnit: 'millisecond',
-      score: ByteEfficiencyAudit.scoreForWastedMs(wastedMsTti),
+      score: resources.length ? 0 : 1,
       details,
       metricSavings: {LCP: wasteLcp.savings, FCP: wasteFcp.savings},
     };

package/core/audits/dobetterweb/uses-passive-event-listeners.js

@@ -38,6 +38,7 @@ class PassiveEventsAudit extends ViolationAudit {
       description: str_(UIStrings.description),
       guidanceLevel: 3,
       requiredArtifacts: ['ConsoleMessages', 'SourceMaps', 'Scripts'],
+      scoreDisplayMode: ViolationAudit.SCORING_MODES.METRIC_SAVINGS,
     };
   }
 

package/core/audits/font-display.js

@@ -51,6 +51,7 @@ class FontDisplay extends Audit {
       supportedModes: ['navigation'],
       guidanceLevel: 3,
       requiredArtifacts: ['devtoolsLogs', 'CSSUsage', 'URL'],
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
     };
   }
 

package/core/audits/largest-contentful-paint-element.js

@@ -46,7 +46,7 @@ class LargestContentfulPaintElement extends Audit {
       id: 'largest-contentful-paint-element',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: Audit.SCORING_MODES.INFORMATIVE,
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 1,
       supportedModes: ['navigation'],
       requiredArtifacts:
@@ -162,7 +162,8 @@ class LargestContentfulPaintElement extends Audit {
     const lcpSavings = Math.max(0, metricLcp - idealLcp);
 
     return {
-      score: 1,
+      score: lcpSavings ? 0 : 1,
+      scoreDisplayMode: lcpSavings ? undefined : Audit.SCORING_MODES.INFORMATIVE,
       displayValue,
       details,
       metricSavings: {

package/core/audits/layout-shift-elements.js

@@ -5,7 +5,8 @@
 
 import {Audit} from './audit.js';
 import * as i18n from '../lib/i18n/i18n.js';
-import {CumulativeLayoutShift} from '../computed/metrics/cumulative-layout-shift.js';
+import {CumulativeLayoutShift as CumulativeLayoutShiftComputed} from '../computed/metrics/cumulative-layout-shift.js';
+import CumulativeLayoutShift from './metrics/cumulative-layout-shift.js';
 
 const UIStrings = {
   /** Descriptive title of a diagnostic audit that provides up to the top five elements contributing to Cumulative Layout Shift. */
@@ -27,7 +28,7 @@ class LayoutShiftElements extends Audit {
       id: 'layout-shift-elements',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: Audit.SCORING_MODES.INFORMATIVE,
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 2,
       requiredArtifacts: ['traces', 'TraceElements'],
     };
@@ -64,10 +65,13 @@ class LayoutShiftElements extends Audit {
     }
 
     const {cumulativeLayoutShift: clsSavings} =
-      await CumulativeLayoutShift.request(artifacts.traces[Audit.DEFAULT_PASS], context);
+      await CumulativeLayoutShiftComputed.request(artifacts.traces[Audit.DEFAULT_PASS], context);
+
+    const passed = clsSavings <= CumulativeLayoutShift.defaultOptions.p10;
 
     return {
-      score: 1,
+      score: passed ? 1 : 0,
+      scoreDisplayMode: passed ? Audit.SCORING_MODES.INFORMATIVE : undefined,
       metricSavings: {
         CLS: clsSavings,
       },

package/core/audits/lcp-lazy-loaded.js

@@ -33,6 +33,7 @@ class LargestContentfulPaintLazyLoaded extends Audit {
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
       supportedModes: ['navigation'],
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 3,
       requiredArtifacts: ['TraceElements', 'ViewportDimensions', 'ImageElements',
         'traces', 'devtoolsLogs', 'GatherContext', 'URL'],

package/core/audits/long-tasks.js

@@ -11,6 +11,7 @@ import {MainThreadTasks} from '../computed/main-thread-tasks.js';
 import {PageDependencyGraph} from '../computed/page-dependency-graph.js';
 import {LoadSimulator} from '../computed/load-simulator.js';
 import {getJavaScriptURLs, getAttributableURLForTask} from '../lib/tracehouse/task-summary.js';
+import {TotalBlockingTime} from '../computed/metrics/total-blocking-time.js';
 
 /** We don't always have timing data for short tasks, if we're missing timing data. Treat it as though it were 0ms. */
 const DEFAULT_TIMING = {startTime: 0, endTime: 0, duration: 0};
@@ -66,8 +67,8 @@ class LongTasks extends Audit {
       scoreDisplayMode: Audit.SCORING_MODES.INFORMATIVE,
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
+      requiredArtifacts: ['traces', 'devtoolsLogs', 'URL', 'GatherContext'],
       guidanceLevel: 1,
-      requiredArtifacts: ['traces', 'devtoolsLogs', 'URL'],
     };
   }
 
@@ -180,6 +181,9 @@ class LongTasks extends Audit {
     const devtoolsLog = artifacts.devtoolsLogs[LongTasks.DEFAULT_PASS];
     const networkRecords = await NetworkRecords.request(devtoolsLog, context);
 
+    const metricComputationData = Audit.makeMetricComputationDataInput(artifacts, context);
+    const tbtResult = await TotalBlockingTime.request(metricComputationData, context);
+
     /** @type {Map<LH.TraceEvent, LH.Gatherer.Simulation.NodeTiming>|undefined} */
     let taskTimingsByEvent;
 
@@ -245,6 +249,9 @@ class LongTasks extends Audit {
       notApplicable: results.length === 0,
       details: tableDetails,
       displayValue,
+      metricSavings: {
+        TBT: tbtResult.timing,
+      },
     };
   }
 }

package/core/audits/mainthread-work-breakdown.js

@@ -16,6 +16,7 @@ import * as i18n from '../lib/i18n/i18n.js';
 import {MainThreadTasks} from '../computed/main-thread-tasks.js';
 import {TotalBlockingTime} from '../computed/metrics/total-blocking-time.js';
 import {Sentry} from '../lib/sentry.js';
+import {Util} from '../../shared/util.js';
 
 const UIStrings = {
   /** Title of a diagnostic audit that provides detail on the main thread work the browser did to load the page. This descriptive title is shown to users when the amount is acceptable and no user action is required. */
@@ -44,7 +45,7 @@ class MainThreadWorkBreakdown extends Audit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      scoreDisplayMode: Audit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       guidanceLevel: 1,
       requiredArtifacts: ['traces', 'devtoolsLogs', 'URL', 'GatherContext'],
     };
@@ -141,6 +142,7 @@ class MainThreadWorkBreakdown extends Audit {
 
     return {
       score,
+      scoreDisplayMode: score >= Util.PASS_THRESHOLD ? Audit.SCORING_MODES.INFORMATIVE : undefined,
       numericValue: totalExecutionTime,
       numericUnit: 'millisecond',
       displayValue: str_(i18n.UIStrings.seconds, {timeInMs: totalExecutionTime}),

package/core/audits/prioritize-lcp-image.js

@@ -10,7 +10,6 @@ import {NetworkRequest} from '../lib/network-request.js';
 import {MainResource} from '../computed/main-resource.js';
 import {LanternLargestContentfulPaint} from '../computed/metrics/lantern-largest-contentful-paint.js';
 import {LoadSimulator} from '../computed/load-simulator.js';
-import {ByteEfficiencyAudit} from './byte-efficiency/byte-efficiency-audit.js';
 import {LCPImageRecord} from '../computed/lcp-image-record.js';
 
 const UIStrings = {
@@ -40,7 +39,7 @@ class PrioritizeLcpImage extends Audit {
       supportedModes: ['navigation'],
       guidanceLevel: 3,
       requiredArtifacts: ['traces', 'devtoolsLogs', 'GatherContext', 'URL', 'TraceElements'],
-      scoreDisplayMode: Audit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
     };
   }
 
@@ -282,7 +281,7 @@ class PrioritizeLcpImage extends Audit {
     }
 
     return {
-      score: ByteEfficiencyAudit.scoreForWastedMs(wastedMs),
+      score: results.length ? 0 : 1,
       numericValue: wastedMs,
       numericUnit: 'millisecond',
       displayValue: wastedMs ? str_(i18n.UIStrings.displayValueMsSavings, {wastedMs}) : '',

package/core/audits/redirects.js

@@ -5,7 +5,6 @@
  */
 
 import {Audit} from './audit.js';
-import {ByteEfficiencyAudit} from './byte-efficiency/byte-efficiency-audit.js';
 import * as i18n from '../lib/i18n/i18n.js';
 import {ProcessedTrace} from '../computed/processed-trace.js';
 import {NetworkRecords} from '../computed/network-records.js';
@@ -29,7 +28,7 @@ class Redirects extends Audit {
       id: 'redirects',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
-      scoreDisplayMode: Audit.SCORING_MODES.NUMERIC,
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       supportedModes: ['navigation'],
       guidanceLevel: 2,
       requiredArtifacts: ['URL', 'GatherContext', 'devtoolsLogs', 'traces'],
@@ -145,7 +144,7 @@ class Redirects extends Audit {
       {overallSavingsMs: totalWastedMs});
 
     return {
-      score: ByteEfficiencyAudit.scoreForWastedMs(totalWastedMs),
+      score: tableRows.length ? 0 : 1,
       numericValue: totalWastedMs,
       numericUnit: 'millisecond',
       displayValue: totalWastedMs ?

package/core/audits/server-response-time.js

@@ -39,6 +39,7 @@ class ServerResponseTime extends Audit {
       supportedModes: ['navigation'],
       guidanceLevel: 1,
       requiredArtifacts: ['devtoolsLogs', 'URL', 'GatherContext'],
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
     };
   }
 
@@ -91,6 +92,7 @@ class ServerResponseTime extends Audit {
       numericValue: responseTime,
       numericUnit: 'millisecond',
       score: Number(passed),
+      scoreDisplayMode: passed ? Audit.SCORING_MODES.INFORMATIVE : undefined,
       displayValue,
       details,
       metricSavings: {

package/core/audits/third-party-facades.js

@@ -88,6 +88,7 @@ class ThirdPartyFacades extends Audit {
       supportedModes: ['navigation'],
       guidanceLevel: 3,
       requiredArtifacts: ['traces', 'devtoolsLogs', 'URL', 'GatherContext'],
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
     };
   }
 

package/core/audits/third-party-summary.js

@@ -75,6 +75,7 @@ class ThirdPartySummary extends Audit {
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
       guidanceLevel: 1,
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
       requiredArtifacts: ['traces', 'devtoolsLogs', 'URL', 'GatherContext'],
     };
   }
@@ -257,8 +258,11 @@ class ThirdPartySummary extends Audit {
     const details = Audit.makeTableDetails(headings, results,
       {...overallSummary, isEntityGrouped: true});
 
+    const passed = overallSummary.wastedMs <= PASS_THRESHOLD_IN_MS;
+
     return {
-      score: Number(overallSummary.wastedMs <= PASS_THRESHOLD_IN_MS),
+      score: Number(passed),
+      scoreDisplayMode: passed ? Audit.SCORING_MODES.INFORMATIVE : undefined,
       displayValue: str_(UIStrings.displayValue, {
         timeInMs: overallSummary.wastedMs,
       }),

package/core/audits/unsized-images.js

@@ -36,6 +36,7 @@ class UnsizedImages extends Audit {
       description: str_(UIStrings.description),
       guidanceLevel: 3,
       requiredArtifacts: ['ImageElements'],
+      scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
     };
   }
 
@@ -153,7 +154,6 @@ class UnsizedImages extends Audit {
 
     return {
       score: unsizedImages.length > 0 ? 0 : 1,
-      notApplicable: images.length === 0,
       details: Audit.makeTableDetails(headings, unsizedImages),
       metricSavings: {
         CLS: 0,