browsertime 28.0.0 → 28.1.0

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # Browsertime changelog (we do [semantic versioning](https://semver.org))
 
+## 28.1.0 - 2026-07-17
+
+### Added
+* Long Animation Frames (`pageinfo.loaf`) now ship every per-script field the LoAF API exposes (`startTime`, `duration`, `executionStart`, `pauseDuration`) plus `startTime` and `firstUIEventTimestamp` per frame — enough to attribute blocking time to individual scripts, place each frame on the page timeline and spot frames where an input was waiting [#2522](https://github.com/sitespeedio/browsertime/pull/2522) [#2523](https://github.com/sitespeedio/browsertime/pull/2523) [#2526](https://github.com/sitespeedio/browsertime/pull/2526).
+* New `pageinfo.loafSummary` key (`totalFrames`, `totalBlockingDuration`, `totalDuration`): `pageinfo.loaf` only ships the 10 frames with the most blocking, so totals computed from it understate busy pages [#2524](https://github.com/sitespeedio/browsertime/pull/2524).
+* LoAF script URLs get the same ResourceLoader `label`s as `cpu.urls` (`load.php[startup]` and friends) [#2525](https://github.com/sitespeedio/browsertime/pull/2525).
+* Multi-module `load.php` batches are labeled with their first module name — pages lazy-load several general batches, so the bare `load.php[scripts]` label collided as soon as there was more than one [#2527](https://github.com/sitespeedio/browsertime/pull/2527).
+
 ## 28.0.0 - 2026-07-17
 
 ### Breaking

package/browserscripts/pageinfo/loaf.js

@@ -17,6 +17,11 @@
     // re-package
     for (let entry of longestBlockingLoAFs) {
       const info = {};
+      // startTime places the frame on the page timeline (before or
+      // after FCP/LCP/load); firstUIEventTimestamp > 0 means an input
+      // was waiting while this frame blocked — the INP connection.
+      info.startTime = entry.startTime;
+      info.firstUIEventTimestamp = entry.firstUIEventTimestamp;
       info.blockingDuration = entry.blockingDuration;
       info.duration = entry.duration;
       info.styleAndLayoutStart = entry.styleAndLayoutStart;
@@ -29,6 +34,16 @@
       info.scripts = [];
       for (let script of entry.scripts) {
         const s = {};
+        // startTime + duration make per-script attribution possible:
+        // without them a frame's blocking can only be credited to
+        // every script that ran in it.
+        s.startTime = script.startTime;
+        s.duration = script.duration;
+        // executionStart - startTime is queue/compile delay before the
+        // script ran; pauseDuration separates "computed the whole time"
+        // from "sat in a sync pause" (alert, sync XHR).
+        s.executionStart = script.executionStart;
+        s.pauseDuration = script.pauseDuration;
         s.forcedStyleAndLayoutDuration = script.forcedStyleAndLayoutDuration;
         s.invoker = script.invoker;
         s.invokerType = script.invokerType;

package/browserscripts/pageinfo/loafSummary.js

@@ -0,0 +1,24 @@
+(function () {
+  // The loaf script ships only the 10 frames with the most blocking
+  // time, so its numbers understate busy pages. These totals are
+  // computed over every long animation frame before the cut.
+  if (
+    PerformanceObserver.supportedEntryTypes.includes('long-animation-frame')
+  ) {
+    const observer = new PerformanceObserver(list => {});
+    observer.observe({type: 'long-animation-frame', buffered: true});
+    const entries = observer.takeRecords();
+
+    let totalBlockingDuration = 0;
+    let totalDuration = 0;
+    for (let entry of entries) {
+      totalBlockingDuration += entry.blockingDuration;
+      totalDuration += entry.duration;
+    }
+    return {
+      totalFrames: entries.length,
+      totalBlockingDuration,
+      totalDuration
+    };
+  }
+})();

package/lib/chrome/mediawikiResourceLoader.js

@@ -96,12 +96,14 @@ export function labelForUrl(url) {
     return 'load.php[startup]';
   }
   const kind = only === 'styles' ? 'styles' : 'scripts';
-  if (modules.length === 1) {
+  // Every multi-module batch carries its (alphabetically) first module
+  // name. Real pages lazy-load several general batches (no `only=`)
+  // over time, so a bare load.php[scripts] label collides as soon as
+  // there is more than one — and the single-module case already names
+  // general batches like raw ones.
+  if (modules.length > 0) {
     return `load.php[${kind}:${modules[0]}]`;
   }
-  if (modules.length > 1 && only === 'scripts') {
-    return `load.php[scripts:${modules[0]}]`;
-  }
   return `load.php[${kind}]`;
 }
 

package/lib/chrome/webdriver/chromium.js

@@ -395,6 +395,20 @@ export class Chromium {
     // this hack fixes that
     if (result.browserScripts && result.browserScripts.pageinfo) {
       result.browserScripts.pageinfo.longTask = this.longTaskInfo;
+
+      // Resolve LoAF script URLs to ResourceLoader module labels the
+      // same way cpu.urls gets them — several frames all blaming one
+      // giant load.php URL say nothing without the module name.
+      if (Array.isArray(result.browserScripts.pageinfo.loaf)) {
+        for (const frame of result.browserScripts.pageinfo.loaf) {
+          for (const script of frame.scripts || []) {
+            const label = labelForUrl(script.sourceURL);
+            if (label) {
+              script.label = label;
+            }
+          }
+        }
+      }
     }
 
     if (this.chrome.collectNetLog && this.chrome.android) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "browsertime",
   "description": "Get performance metrics from your web page using Browsertime.",
-  "version": "28.0.0",
+  "version": "28.1.0",
   "bin": "./bin/browsertime.js",
   "type": "module",
   "types": "./scripting.d.ts",

package/types/chrome/mediawikiResourceLoader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mediawikiResourceLoader.d.ts","sourceRoot":"","sources":["../../lib/chrome/mediawikiResourceLoader.js"],"names":[],"mappings":"AAmBA,mEAEC;AA6DD,8CAuBC;AAcD,8DAUC;AAwBD;;;;;EAkCC;AAOD,6EA4BC"}
+{"version":3,"file":"mediawikiResourceLoader.d.ts","sourceRoot":"","sources":["../../lib/chrome/mediawikiResourceLoader.js"],"names":[],"mappings":"AAmBA,mEAEC;AA6DD,8CAyBC;AAcD,8DAUC;AAwBD;;;;;EAkCC;AAOD,6EA4BC"}