lighthouse 12.1.0-dev.20240805 → 12.1.0-dev.20240806

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

@@ -101,10 +101,13 @@ class ThirdPartySummary extends Audit {
       const taskDuration = task.selfTime * cpuMultiplier;
       // The amount of time spent on main thread is the sum of all durations.
       urlSummary.mainThreadTime += taskDuration;
-      // The amount of time spent *blocking* on main thread is the sum of all time longer than 50ms.
-      // Note that this is not totally equivalent to the TBT definition since it fails to account for FCP,
-      // but a majority of third-party work occurs after FCP and should yield largely similar numbers.
-      urlSummary.blockingTime += Math.max(taskDuration - 50, 0);
+      // Blocking time is the amount of time spent on the main thread *over* 50ms.
+      // This value is interpolated because not all tasks attributed to this URL are at the top level.
+      //
+      // Note that this is not totally equivalent to the TBT definition since it fails to account for
+      // the FCP&TTI bounds of TBT.
+      urlSummary.blockingTime += task.selfBlockingTime;
+      // TBT impact is similar to blocking time, but it accounts for the FCP&TTI bounds of TBT.
       urlSummary.tbtImpact += task.selfTbtImpact;
       byURL.set(attributableURL, urlSummary);
     }

package/core/computed/metrics/lantern-first-contentful-paint.js

@@ -16,8 +16,8 @@ class LanternFirstContentfulPaint extends Lantern.Metrics.FirstContentfulPaint {
    * @return {Promise<LH.Artifacts.LanternMetric>}
    */
   static async computeMetricWithGraphs(data, context, extras) {
-    return this.compute(await getComputationDataParams(data, context), extras)
-      .catch(lanternErrorAdapter);
+    const params = await getComputationDataParams(data, context);
+    return Promise.resolve(this.compute(params, extras)).catch(lanternErrorAdapter);
   }
 
   /**

package/core/computed/metrics/lantern-interactive.js

@@ -17,8 +17,8 @@ class LanternInteractive extends Lantern.Metrics.Interactive {
    * @return {Promise<LH.Artifacts.LanternMetric>}
    */
   static async computeMetricWithGraphs(data, context, extras) {
-    return this.compute(await getComputationDataParams(data, context), extras)
-      .catch(lanternErrorAdapter);
+    const params = await getComputationDataParams(data, context);
+    return Promise.resolve(this.compute(params, extras)).catch(lanternErrorAdapter);
   }
 
   /**

package/core/computed/metrics/lantern-largest-contentful-paint.js

@@ -17,8 +17,8 @@ class LanternLargestContentfulPaint extends Lantern.Metrics.LargestContentfulPai
    * @return {Promise<LH.Artifacts.LanternMetric>}
    */
   static async computeMetricWithGraphs(data, context, extras) {
-    return this.compute(await getComputationDataParams(data, context), extras)
-      .catch(lanternErrorAdapter);
+    const params = await getComputationDataParams(data, context);
+    return Promise.resolve(this.compute(params, extras)).catch(lanternErrorAdapter);
   }
 
   /**

package/core/computed/metrics/lantern-max-potential-fid.js

@@ -17,8 +17,8 @@ class LanternMaxPotentialFID extends Lantern.Metrics.MaxPotentialFID {
    * @return {Promise<LH.Artifacts.LanternMetric>}
    */
   static async computeMetricWithGraphs(data, context, extras) {
-    return this.compute(await getComputationDataParams(data, context), extras)
-      .catch(lanternErrorAdapter);
+    const params = await getComputationDataParams(data, context);
+    return Promise.resolve(this.compute(params, extras)).catch(lanternErrorAdapter);
   }
 
   /**

package/core/computed/metrics/lantern-speed-index.js

@@ -18,8 +18,8 @@ class LanternSpeedIndex extends Lantern.Metrics.SpeedIndex {
    * @return {Promise<LH.Artifacts.LanternMetric>}
    */
   static async computeMetricWithGraphs(data, context, extras) {
-    return this.compute(await getComputationDataParams(data, context), extras)
-      .catch(lanternErrorAdapter);
+    const params = await getComputationDataParams(data, context);
+    return Promise.resolve(this.compute(params, extras)).catch(lanternErrorAdapter);
   }
 
   /**

package/core/computed/navigation-insights.d.ts

@@ -11,6 +11,6 @@ declare class NavigationInsights {
       * @param {LH.Trace} trace
       * @param {LH.Artifacts.ComputedContext} context
      */
-    static compute_(trace: LH.Trace, context: LH.Artifacts.ComputedContext): Promise<import("@paulirish/trace_engine/models/trace/insights/types.js").NavigationInsightData<typeof import("@paulirish/trace_engine/models/trace/handlers/ModelHandlers.js")>>;
+    static compute_(trace: LH.Trace, context: LH.Artifacts.ComputedContext): Promise<import("@paulirish/trace_engine/models/trace/insights/types.js").NavigationInsightData>;
 }
 //# sourceMappingURL=navigation-insights.d.ts.map

package/core/computed/tbt-impact-tasks.d.ts

@@ -20,8 +20,9 @@ declare class TBTImpactTasks {
     /**
      * @param {LH.Artifacts.TaskNode[]} tasks
      * @param {Map<LH.Artifacts.TaskNode, number>} taskToImpact
+     * @param {Map<LH.Artifacts.TaskNode, number>} taskToBlockingTime
      */
-    static createImpactTasks(tasks: LH.Artifacts.TaskNode[], taskToImpact: Map<LH.Artifacts.TaskNode, number>): import("../index.js").Artifacts.TBTImpactTask[];
+    static createImpactTasks(tasks: LH.Artifacts.TaskNode[], taskToImpact: Map<LH.Artifacts.TaskNode, number>, taskToBlockingTime: Map<LH.Artifacts.TaskNode, number>): import("../index.js").Artifacts.TBTImpactTask[];
     /**
      * @param {LH.Artifacts.TaskNode[]} tasks
      * @param {number} startTimeMs

package/core/computed/tbt-impact-tasks.js

@@ -64,8 +64,9 @@ class TBTImpactTasks {
   /**
    * @param {LH.Artifacts.TaskNode[]} tasks
    * @param {Map<LH.Artifacts.TaskNode, number>} taskToImpact
+   * @param {Map<LH.Artifacts.TaskNode, number>} taskToBlockingTime
    */
-  static createImpactTasks(tasks, taskToImpact) {
+  static createImpactTasks(tasks, taskToImpact, taskToBlockingTime) {
     /** @type {LH.Artifacts.TBTImpactTask[]} */
     const tbtImpactTasks = [];
 
@@ -73,15 +74,25 @@ class TBTImpactTasks {
       const tbtImpact = taskToImpact.get(task) || 0;
       let selfTbtImpact = tbtImpact;
 
+      const blockingTime = taskToBlockingTime.get(task) || 0;
+      let selfBlockingTime = blockingTime;
+
       for (const child of task.children) {
         const childTbtImpact = taskToImpact.get(child) || 0;
         selfTbtImpact -= childTbtImpact;
+
+        const childBlockingTime = taskToBlockingTime.get(child) || 0;
+        selfBlockingTime -= childBlockingTime;
       }
 
       tbtImpactTasks.push({
         ...task,
-        tbtImpact,
-        selfTbtImpact,
+        // Floating point numbers are not perfectly precise, so the subtraction operations above
+        // can sometimes output negative numbers close to 0 here. To prevent potentially confusing
+        // output we should bump those values to 0.
+        tbtImpact: Math.max(tbtImpact, 0),
+        selfTbtImpact: Math.max(selfTbtImpact, 0),
+        selfBlockingTime: Math.max(selfBlockingTime, 0),
       });
     }
 
@@ -98,6 +109,9 @@ class TBTImpactTasks {
     /** @type {Map<LH.Artifacts.TaskNode, number>} */
     const taskToImpact = new Map();
 
+    /** @type {Map<LH.Artifacts.TaskNode, number>} */
+    const taskToBlockingTime = new Map();
+
     for (const task of tasks) {
       const event = {
         start: task.startTime,
@@ -113,11 +127,13 @@ class TBTImpactTasks {
       };
 
       const tbtImpact = calculateTbtImpactForEvent(event, startTimeMs, endTimeMs, topLevelEvent);
+      const blockingTime = calculateTbtImpactForEvent(event, -Infinity, Infinity, topLevelEvent);
 
       taskToImpact.set(task, tbtImpact);
+      taskToBlockingTime.set(task, blockingTime);
     }
 
-    return this.createImpactTasks(tasks, taskToImpact);
+    return this.createImpactTasks(tasks, taskToImpact, taskToBlockingTime);
   }
 
   /**
@@ -131,6 +147,9 @@ class TBTImpactTasks {
     /** @type {Map<LH.Artifacts.TaskNode, number>} */
     const taskToImpact = new Map();
 
+    /** @type {Map<LH.Artifacts.TaskNode, number>} */
+    const taskToBlockingTime = new Map();
+
     /** @type {Map<LH.Artifacts.TaskNode, {start: number, end: number, duration: number}>} */
     const topLevelTaskToEvent = new Map();
 
@@ -151,19 +170,21 @@ class TBTImpactTasks {
       };
 
       const tbtImpact = calculateTbtImpactForEvent(event, startTimeMs, endTimeMs);
+      const blockingTime = calculateTbtImpactForEvent(event, -Infinity, Infinity);
 
       const task = traceEventToTask.get(node.event);
       if (!task) continue;
 
       topLevelTaskToEvent.set(task, event);
       taskToImpact.set(task, tbtImpact);
+      taskToBlockingTime.set(task, blockingTime);
     }
 
     // Interpolate the TBT impact of remaining tasks using the top level ancestor tasks.
     // We don't have any lantern estimates for tasks that are not top level, so we need to estimate
     // the lantern timing based on the task's observed timing relative to it's top level task's observed timing.
     for (const task of tasks) {
-      if (taskToImpact.has(task)) continue;
+      if (taskToImpact.has(task) || taskToBlockingTime.has(task)) continue;
 
       const topLevelTask = this.getTopLevelTask(task);
 
@@ -183,11 +204,13 @@ class TBTImpactTasks {
       };
 
       const tbtImpact = calculateTbtImpactForEvent(event, startTimeMs, endTimeMs, topLevelEvent);
+      const blockingTime = calculateTbtImpactForEvent(event, -Infinity, Infinity, topLevelEvent);
 
       taskToImpact.set(task, tbtImpact);
+      taskToBlockingTime.set(task, blockingTime);
     }
 
-    return this.createImpactTasks(tasks, taskToImpact);
+    return this.createImpactTasks(tasks, taskToImpact, taskToBlockingTime);
   }
 
   /**

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lighthouse",
   "type": "module",
-  "version": "12.1.0-dev.20240805",
+  "version": "12.1.0-dev.20240806",
   "description": "Automated auditing, performance metrics, and best practices for the web.",
   "main": "./core/index.js",
   "bin": {
@@ -167,7 +167,7 @@
     "pako": "^2.0.3",
     "preact": "^10.7.2",
     "pretty-json-stringify": "^0.0.2",
-    "puppeteer": "^22.13.1",
+    "puppeteer": "^22.15.0",
     "resolve": "^1.22.1",
     "rollup": "^2.52.7",
     "rollup-plugin-polyfill-node": "^0.12.0",
@@ -181,7 +181,7 @@
     "webtreemap-cdt": "^3.2.1"
   },
   "dependencies": {
-    "@paulirish/trace_engine": "0.0.28",
+    "@paulirish/trace_engine": "0.0.32",
     "@sentry/node": "^6.17.4",
     "axe-core": "^4.9.1",
     "chrome-launcher": "^1.1.2",
@@ -200,11 +200,11 @@
     "metaviewport-parser": "0.3.0",
     "open": "^8.4.0",
     "parse-cache-control": "1.0.1",
-    "puppeteer-core": "^22.13.1",
+    "puppeteer-core": "^22.15.0",
     "robots-parser": "^3.0.1",
     "semver": "^5.3.0",
     "speedline-core": "^1.4.3",
-    "third-party-web": "^0.24.3",
+    "third-party-web": "^0.24.5",
     "tldts-icann": "^6.1.16",
     "ws": "^7.0.0",
     "yargs": "^17.3.1",

package/types/artifacts.d.ts

@@ -163,7 +163,7 @@ declare module Artifacts {
 
   type NetworkRequest = _NetworkRequest;
   type TaskNode = _TaskNode;
-  type TBTImpactTask = TaskNode & {tbtImpact: number, selfTbtImpact: number};
+  type TBTImpactTask = TaskNode & {tbtImpact: number, selfTbtImpact: number, selfBlockingTime: number};
   type MetaElement = Artifacts['MetaElements'][0];
 
   interface URL {
@@ -511,7 +511,7 @@ declare module Artifacts {
 
   interface TraceEngineResult {
     data: TraceEngine.Handlers.Types.TraceParseData;
-    insights: TraceEngine.Insights.Types.TraceInsightData<typeof TraceEngine.Handlers.ModelHandlers>;
+    insights: TraceEngine.Insights.Types.TraceInsightData;
   }
 
   interface TraceEngineRootCauses {