xwp / site-performance-tracker

Allows you to detect and track site performance metrics
GNU General Public License v2.0
96 stars 15 forks source link

Support for Web Vitals #22

Closed kasparsd closed 3 years ago

kasparsd commented 4 years ago

Add support for tracking Web Vitals.

mehigh commented 3 years ago

By providing an feature for https://github.com/GoogleChrome/web-vitals/ We would be able to gather RUM data immediately post-deployment in Google Analytics rather than wait 28 days for GSC data to refresh

This particular feature only as a dependency for Google Analytics, and due to the availability of buffering for performance observer entering https://www.chromestatus.com/feature/5118272741572608 the metrics before the monitoring code is run would also be made available, hence this can be delayed to run much later when the CPU is idling. https://github.com/GoogleChromeLabs/web-vitals-report/blob/71b0879334798c732f460945ded5267cab5a36bf/src/js/analytics.js#L135

Events are sent to Google Analytics There's console logging instead when gtag / analytics global is not present

Implementation There is no negative consequence for monitoring to FCP/LCP (i.e. if we're loading the library on CPU idle). Use requestidlecallback to send these only if support for this feature is present, even at the expense of not tracking some entries Check for the gtag global to be defined, log to the console if gtag global is not available (useful for staging environments) The script is loaded via type="module" so the extra JS doesn't get sent to browsers without support for PerformanceObserver.