diff --git a/docs/src/.vitepress/theme/index.ts b/docs/src/.vitepress/theme/index.ts
index fc20152b..1d1bcad6 100644
--- a/docs/src/.vitepress/theme/index.ts
+++ b/docs/src/.vitepress/theme/index.ts
@@ -1,7 +1,6 @@
 import type { Theme } from 'vitepress'
 import VueAnimXyz from '@animxyz/vue3'
 import DefaultTheme from 'vitepress/theme'
-import { webVitals } from '../plugins/vercel-web-vitals-api'
 import Layout from './layouts/default.vue'
 import 'virtual:windi.css'
 import '@animxyz/core'
@@ -14,7 +13,6 @@ const CustomTheme = {
   Layout,
   enhanceApp: ({ app }) => {
     app.use(VueAnimXyz)
-    webVitals({ analyticsId: '__ANALYTICS_ID__', debug: false })
   },
 } as Theme
 
diff --git a/docs/src/.vitepress/theme/layouts/default.vue b/docs/src/.vitepress/theme/layouts/default.vue
index 5b12f329..e966721f 100644
--- a/docs/src/.vitepress/theme/layouts/default.vue
+++ b/docs/src/.vitepress/theme/layouts/default.vue
@@ -1,7 +1,12 @@
 <script setup>
 import DefaultTheme from 'vitepress/theme'
+import { webVitals } from '../../plugins/vercel-web-vitals-api'
 
 const { Layout: ParentLayout } = DefaultTheme
+
+onMounted(() => {
+  webVitals({ analyticsId: '__ANALYTICS_ID__', debug: false })
+})
 </script>
 
 <template>