feat: optimize Google Analytics tracking with idle callbacks and beacon transport

Author: himeshr

Makefile

@@ -1,17 +1,11 @@
 # Speedier defaults and robust targets
 .PHONY: start deps clean build serve
 
-NPM_FLAGS ?= --prefer-offline --no-audit --no-fund
-
 start:
 	npm run develop
 
 deps:
-	@if [ -d node_modules ]; then \
-	  npm i $(NPM_FLAGS); \
-	else \
-	  npm ci $(NPM_FLAGS); \
-	fi
+	npm i
 
 clean:
 	rm -rf node_modules

gatsby-browser.js

@@ -0,0 +1,8 @@
+export const onRouteUpdate = () => {
+  const send = () => window.gtag && window.gtag('event', 'page_view');
+  if ('requestIdleCallback' in window) {
+    requestIdleCallback(send, { timeout: 2000 });
+  } else {
+    setTimeout(send, 2000);
+  }
+};

gatsby-config.js

@@ -19,6 +19,8 @@ module.exports = {
                 ],
                 gtagConfig: {
                     anonymize_ip: true,
+                    send_page_view: false,
+                    transport_type: 'beacon',
                 },
                 pluginConfig: {
                     head: false,