Production configuration
Endpoint, a 10 % sample rate, a consent value and Do Not Track: the props end up in the page as plain configuration, so never pass secrets. Consent, Do Not Track and sampling are evaluated in the browser on every page load.
Production configuration
examples/output/production.html---
import { WebVitals } from "@casoon/astro-webvitals";
// Your consent state, e.g. from a consent manager.
const hasAnalyticsConsent = true;
---
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Production</title>
</head>
<body>
<h1>Production</h1>
<WebVitals
endpoint="/api/analytics/vitals"
sampleRate={0.1}
consent={hasAnalyticsConsent}
respectDnt={true}
/>
</body>
</html><script>(function(){const config = {
"debug": false,
"consoleDock": false,
"endpoint": "/api/analytics/vitals",
"position": "bottom-right",
"desktopPositions": {
"top-right": "top: 16px; right: 16px;",
"top-left": "top: 16px; left: 16px;",
"bottom-right": "bottom: 16px; right: 16px;",
"bottom-left": "bottom: 16px; left: 16px;"
},
"mobilePosition": "bottom: 0; left: 0; right: 0;",
"batchReporting": true,
"batchInterval": 5000,
"checkAccessibility": false,
"highlightAccessibility": false,
"extendedMetrics": false,
"smartDetection": false,
"performanceBudget": {
"LCP": 2500,
"CLS": 0.1,
"FCP": 1800,
"TTFB": 800,
"INP": 200
},
"headers": {},
"sampleRate": 0.1,
"trackSoftNavigations": false,
"attribution": false,
"trackLongTasks": false,
"maxBatchSize": 10,
"retryFailedMetrics": false,
"respectDnt": true,
"consent": true,
"dashboard": false
};
window.__WEBVITALS_CONFIG__ = config;
})();</script>
<script type="module" src="/_astro/WebVitals.astro_astro_type_script_index_0_lang.KhS4lISl.js"></script>