v151 · Performance · Timing Field Inspector

Timing Field Inspector

Fetch a batch of resources and inspect their PerformanceResourceTiming entries. Chrome 151 adds workerMatchedRouterSource and workerFinalRouterSource — the table below highlights these two new fields for every captured entry.

Chrome 151 required for new fields. The inspector works in any browser — existing timing fields are always shown. The two new workerMatchedRouterSource / workerFinalRouterSource columns will show field not supported in older browsers, and will typically read "" (empty string) for requests not intercepted by a Service Worker Static Router rule.

live demo

Checking browser support…

Click "Fetch resources" to capture PerformanceResourceTiming entries.

code

// Observe resource timing entries as they arrive
const observer = new PerformanceObserver(list => {
  for (const entry of list.getEntries()) {
    const rt = entry; // PerformanceResourceTiming

    console.log({
      name: rt.name,
      duration: rt.duration.toFixed(1),

      // Chrome 151+ fields — empty string if no SW router rule matched
      workerMatchedRouterSource: rt.workerMatchedRouterSource,
      workerFinalRouterSource:   rt.workerFinalRouterSource,
    });
  }
});

observer.observe({ type: 'resource', buffered: true });

see also

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗