diff --git a/web/src/App.tsx b/web/src/App.tsx
index 30b8148..d49d46d 100644
--- a/web/src/App.tsx
+++ b/web/src/App.tsx
@@ -1,5 +1,17 @@
-import {Outlet} from "@tanstack/react-router";
-import {TanStackRouterDevtools} from "@tanstack/router-devtools";
+import { Outlet } from "@tanstack/react-router";
+import React from "react";
+
+const TanStackRouterDevtools =
+	process.env.NODE_ENV === "production"
+		? () => null // Render nothing in production
+		: React.lazy(() =>
+				// Lazy load in development
+				import("@tanstack/router-devtools").then((res) => ({
+					default: res.TanStackRouterDevtools,
+					// For Embedded Mode
+					// default: res.TanStackRouterDevtoolsPanel
+				})),
+			);
 
 function App() {
 	return (