diff --git a/assets/scripts/effects.js b/assets/scripts/effects.js
index aa1167c..b1f639f 100644
--- a/assets/scripts/effects.js
+++ b/assets/scripts/effects.js
@@ -5,18 +5,13 @@ const defaultPrefs = {
   language: "english",
   theme: "auto",
 };
-if (umami != null) {
-  umami.identify({ deviceTheme: darkModeMediaQuery ? "dark" : "light" });
-}
-Object.entries(defaultPrefs).forEach(([key, defaultPref]) => {
-  const currentPref = localStorage.getItem(key) ?? defaultPref;
-  applyPreference(key, currentPref, false);
-  document.querySelectorAll(`input[name=${key}]`).forEach((input) => {
-    input.addEventListener("change", (e) => {
-      applyPreference(key, e.currentTarget.value, true);
-    });
-  });
+
+document.querySelector('script[data-website-id]').addEventListener('load', () => {
+  try {
+    umami.identify({ deviceTheme: darkModeMediaQuery ? "dark" : "light" });
+  } catch {}
 });
+
 function applyPreference(key, value, shouldSave) {
   if (umami !== null) {
     umami.identify({
@@ -37,6 +32,31 @@ function applyPreference(key, value, shouldSave) {
   }
 }
 
+/** @param {Event} evt */
+function removeEffect({ target }) {
+  const effectsLayer = document.querySelector("#effects");
+  const effects = Array.from(effectsLayer.children).filter(
+    (e) => e.__effectParent === target,
+  );
+  effects.forEach((e) => {
+    e.getAnimations().forEach((anim) => {
+      if (anim.currentTime < 100) {
+        anim.pause();
+        effectsLayer.removeChild(e);
+        return;
+      }
+      anim.pause();
+      anim.updatePlaybackRate(-0.25);
+      anim.play();
+      anim.addEventListener("finish", () => {
+        if (effectsLayer.contains(e)) {
+          effectsLayer.removeChild(e);
+        }
+      });
+    });
+  });
+}
+
 /** @param {Event} evt */
 function addEffect({ target }) {
   const effectsLayer = document.querySelector("#effects");
@@ -64,32 +84,20 @@ function addEffect({ target }) {
     effectsLayer.appendChild(newEffect);
   });
 }
-document.addEventListener("mouseenter", addEffect, true);
-document.addEventListener("focus", addEffect, true);
 
-/** @param {Event} evt */
-function removeEffect({ target }) {
-  const effectsLayer = document.querySelector("#effects");
-  const effects = Array.from(effectsLayer.children).filter(
-    (e) => e.__effectParent === target,
-  );
-  effects.forEach((e) => {
-    e.getAnimations().forEach((anim) => {
-      if (anim.currentTime < 100) {
-        anim.pause();
-        effectsLayer.removeChild(e);
-        return;
-      }
-      anim.pause();
-      anim.updatePlaybackRate(-0.25);
-      anim.play();
-      anim.addEventListener("finish", () => {
-        if (effectsLayer.contains(e)) {
-          effectsLayer.removeChild(e);
-        }
+document.addEventListener('DOMContentLoaded', () => {
+  Object.entries(defaultPrefs).forEach(([key, defaultPref]) => {
+    const currentPref = localStorage.getItem(key) ?? defaultPref;
+    applyPreference(key, currentPref, false);
+    document.querySelectorAll(`input[name=${key}]`).forEach((input) => {
+      input.addEventListener("change", (e) => {
+        applyPreference(key, e.currentTarget.value, true);
       });
     });
   });
-}
-document.addEventListener("mouseleave", removeEffect, true);
-document.addEventListener("blur", removeEffect, true);
+  document.addEventListener("mouseenter", addEffect, true);
+  document.addEventListener("focus", addEffect, true);
+
+  document.addEventListener("mouseleave", removeEffect, true);
+  document.addEventListener("blur", removeEffect, true);
+});
diff --git a/site/_includes/base.njk b/site/_includes/base.njk
index fd520a3..6fada9c 100644
--- a/site/_includes/base.njk
+++ b/site/_includes/base.njk
@@ -11,7 +11,7 @@ title: Joshua's Homepage
     <link rel="stylesheet" href="{{ "/site.css" | url }}"/>
     <link rel="preload" as="font" href="/fonts/inter/InterVariable.woff2"/>
     <script defer src="https://stats.apps.seigler.net/script.js" data-website-id="ccb4bd94-2a71-47fe-8eea-d85bf75b7f6d"></script>
-    <script src="/scripts/effects.js"></script>
+    <script async src="/scripts/effects.js"></script>
     <link rel="prefetch" href="/fonts/inter/InterVariable-Italic.woff2"/>
     <link rel="prefetch" href="/fonts/ftaurebesh/ftaurebesh-medium.woff2"/>
     <link rel="prefetch" href="/fonts/ftaurebesh/ftaurebesh-bold.woff2"/>