javascriptsafaricross-browserweb-performance

new PerformanceObserver(cb).observe({ type: 'paint', buffered: true }) doesn't work in Safari

new PerformanceObserver((list) => {
  list.getEntries().forEach(console.log);
}).observe({ type: 'paint', buffered: true });

performance.getEntriesByType('paint').forEach(console.log);

These two snippets log matching paint entries in Chrome, Firefox, Edge, and Opera. However, in Safari 15.3 the PerformanceObserver approach doesn't log at all (the callback isn't invoked), but the getEntriesByType approach does log the "first-contentful-paint" entry. It seems that Safari supports PerformanceObserver.observe and supports the PerformancePaintTiming API. Why does the above PerformanceObserver approach not work in Safari?

If there is a bug in Safari do you think that getEntriesByTypes without a PerformanceObserver's buffer is OK to use instead? Thanks.

Solution

  • This is being worked in Safari. Follow this bug: to see it: https://bugs.webkit.org/show_bug.cgi?id=225305

    If there is a bug in Safari do you think that getEntriesByTypes without a PerformanceObserver's buffer is OK to use instead? Thanks.

    The issue with not having buffered option is you can miss observations that happened before you registered the observer. See here where I noticed inconsistency with whether events were measured or not: https://github.com/GoogleChrome/web-vitals/pull/139