36 lines
1.0 KiB
TypeScript
36 lines
1.0 KiB
TypeScript
/**
|
|
* Core Web Vitals reporting via PostHog.
|
|
*
|
|
* Tracks LCP, INP, CLS, FCP, and TTFB as PostHog events so we can
|
|
* build dashboards and correlate performance with product usage.
|
|
*
|
|
* Each metric fires once per page load. PostHog captures 100% of
|
|
* sessions (vs Sentry's 20% sample), giving better coverage.
|
|
*/
|
|
import { onLCP, onINP, onCLS, onFCP, onTTFB } from 'web-vitals'
|
|
import type { Metric } from 'web-vitals'
|
|
import posthog from 'posthog-js'
|
|
|
|
function sendToPostHog(metric: Metric) {
|
|
// Only send if PostHog is loaded
|
|
if (!(posthog as unknown as { __loaded?: boolean }).__loaded) return
|
|
|
|
posthog.capture('web_vitals', {
|
|
metric_name: metric.name,
|
|
metric_value: metric.value,
|
|
metric_rating: metric.rating,
|
|
metric_delta: metric.delta,
|
|
metric_id: metric.id,
|
|
page_path: window.location.pathname,
|
|
})
|
|
}
|
|
|
|
/** Register all Web Vitals observers. Call once after PostHog init. */
|
|
export function initWebVitals() {
|
|
onLCP(sendToPostHog)
|
|
onINP(sendToPostHog)
|
|
onCLS(sendToPostHog)
|
|
onFCP(sendToPostHog)
|
|
onTTFB(sendToPostHog)
|
|
}
|