Add GA using web workers (partytown)

astro.config.mjs

@@ -5,6 +5,7 @@ import tailwind from "@astrojs/tailwind";
 import sitemap from "@astrojs/sitemap";
 import mdx from '@astrojs/mdx';
 import prefetch from '@astrojs/prefetch';
+import partytown from '@astrojs/partytown';
 import compress from "astro-compress";
 import remarkCodeLabels from './plugins/remark-code-labels.mjs';
 
@@ -20,6 +21,11 @@ export default defineConfig({
     tailwind({
       config: { applyBaseStyles: false },
     }),
+    partytown({
+      config: {
+        forward: ['dataLayer.push']
+      }
+    }),
     compress()
   ],
 });

package.json

@@ -11,6 +11,7 @@
   },
   "devDependencies": {
     "@astrojs/mdx": "^0.10.3",
+    "@astrojs/partytown": "^1.0.0",
     "@astrojs/prefetch": "^0.0.7",
     "@astrojs/react": "^0.1.2",
     "@astrojs/sitemap": "^0.1.0",

src/components/BaseHead.astro

@@ -2,9 +2,9 @@
 import "../styles/index.css";
 
 export interface Props {
-	title: string;
-	description: string;
-	permalink: string;
+  title: string;
+  description: string;
+  permalink: string;
 }
 
 const { title, description, permalink } = Astro.props;
@@ -38,6 +38,21 @@ const { title, description, permalink } = Astro.props;
 <link rel="preconnect" href="https://fonts.googleapis.com" />
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
 <link
-	href="https://fonts.googleapis.com/css2?family=Bodoni+Moda:opsz@6..96&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Share+Tech+Mono&display=swap"
-	rel="stylesheet"
+  href="https://fonts.googleapis.com/css2?family=Bodoni+Moda:opsz@6..96&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Share+Tech+Mono&display=swap"
+  rel="stylesheet"
 />
+
+<!-- Google tag (gtag.js) -->
+<script
+  type="text/partytown"
+  async
+  src="https://www.googletagmanager.com/gtag/js?id=G-EJ67MTJ8RD"
+></script>
+<script type="text/partytown">
+  window.dataLayer = window.dataLayer || [];
+  function gtag() {
+    dataLayer.push(arguments);
+  }
+  gtag("js", new Date());
+  gtag("config", "G-EJ67MTJ8RD");
+</script>