v150 · Performance

Observer Playground

Toggle which PerformanceObserver entry types are active, trigger navigations or interactions, and inspect the raw JSON of every entry that arrives — including soft-navigation entries from Chrome 150.

Feature detection: checking…

Observed entry types

Entry stream 0 entries
No entries yet — activate types and trigger actions above
// Get all supported entry types
const types = PerformanceObserver.supportedEntryTypes;
// → ["element", "event", "first-input", "largest-contentful-paint",
//    "layout-shift", "longtask", "mark", "measure", "navigation",
//    "paint", "resource", "soft-navigation", ...]

// Subscribe to one or more types
const observer = new PerformanceObserver((list) => {
  for (const entry of list.getEntries()) {
    console.log(entry.entryType, entry.toJSON());
  }
});

observer.observe({
  entryTypes: ["soft-navigation", "largest-contentful-paint"]
});

see also

implementation reference

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