diff --git a/frontend/src/app/layout.tsx b/frontend/src/app/layout.tsx
index 30e8e5b..06b2e1c 100644
--- a/frontend/src/app/layout.tsx
+++ b/frontend/src/app/layout.tsx
@@ -1,5 +1,7 @@
 import type { Metadata } from "next";
 import { ThemeProvider } from "@/components/theme-provider";
+import ServiceWorkerManager from "@/components/ServiceWorkerManager";
+
 import {
   Geist,
   Geist_Mono,
@@ -61,6 +63,7 @@ export default function RootLayout({
           disableTransitionOnChange
         >
           <div className="min-h-screen selection:bg-red-200 dark:selection:bg-red-900">
+            <ServiceWorkerManager />
             <GSAPCursor />
             <NavigationMenu />
             {children}
diff --git a/frontend/src/components/ServiceWorkerManager.tsx b/frontend/src/components/ServiceWorkerManager.tsx
new file mode 100644
index 0000000..8f16261
--- /dev/null
+++ b/frontend/src/components/ServiceWorkerManager.tsx
@@ -0,0 +1,31 @@
+"use client";
+
+import { useEffect } from "react";
+
+export default function ServiceWorkerManager() {
+  useEffect(() => {
+    if ("serviceWorker" in navigator) {
+      // Unregister old service workers
+      navigator.serviceWorker.getRegistrations().then((registrations) => {
+        for (const registration of registrations) {
+          registration.unregister();
+        }
+      });
+      // Optionally, clear caches (note: this is not supported in all browsers)
+      if ("caches" in window) {
+        caches.keys().then((cacheNames) => {
+          Promise.all(cacheNames.map((cache) => caches.delete(cache)));
+        });
+      }
+      // Optional: Set a flag in localStorage to avoid repeated cache clearing
+      if (!localStorage.getItem("cacheCleared")) {
+        caches.keys().then((keys) => {
+          keys.forEach((key) => caches.delete(key));
+          localStorage.setItem("cacheCleared", "true");
+        });
+      }
+    }
+  }, []);
+
+  return null; // This component does not render anything
+}