diff --git a/src/App.tsx b/src/App.tsx
index bf223a46..72658c6f 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -134,17 +134,6 @@ function NavigationTracker() {
 }
 
 function AppContent(): React.JSX.Element {
-  // Initialize Cronitor RUM inside BrowserRouter (where history is available)
-  useEffect(() => {
-    Cronitor.load("0b5d17d3f7625ce8766c2c4c85c1895d", {
-      debug: import.meta.env.DEV, // Enable debug logs in development only
-      trackMode: 'history', // Automatically track page views with React Router
-    });
-    
-    // Log successful initialization
-    console.log('[Cronitor] RUM initialized');
-  }, []);
-
   // Check if API status banner is visible to add padding
   const { passing, isBannerDismissed } = useCronitorHealth();
   const showBanner = passing === false && !isBannerDismissed;
@@ -409,22 +398,39 @@ function AppContent(): React.JSX.Element {
   );
 }
 
-const App = (): React.JSX.Element => (
-  <QueryClientProvider client={queryClient}>
-    <AuthProvider>
-      <AuthModalProvider>
-        <MFAStepUpProvider>
-          <CronitorHealthProvider>
-            <BrowserRouter>
-              <AppContent />
-            </BrowserRouter>
-          </CronitorHealthProvider>
-        </MFAStepUpProvider>
-      </AuthModalProvider>
-    </AuthProvider>
-    {import.meta.env.DEV && <ReactQueryDevtools initialIsOpen={false} position="bottom" />}
-    <AnalyticsWrapper />
-  </QueryClientProvider>
-);
+const App = (): React.JSX.Element => {
+  // Initialize Cronitor RUM before router mounts
+  useEffect(() => {
+    try {
+      Cronitor.load("0b5d17d3f7625ce8766c2c4c85c1895d", {
+        debug: import.meta.env.DEV, // Enable debug logs in development only
+        trackMode: 'history', // Automatically track page views with React Router
+      });
+      
+      // Log successful initialization
+      console.log('[Cronitor] RUM initialized');
+    } catch (error) {
+      console.error('[Cronitor] Failed to initialize:', error);
+    }
+  }, []);
+
+  return (
+    <QueryClientProvider client={queryClient}>
+      <AuthProvider>
+        <AuthModalProvider>
+          <MFAStepUpProvider>
+            <CronitorHealthProvider>
+              <BrowserRouter>
+                <AppContent />
+              </BrowserRouter>
+            </CronitorHealthProvider>
+          </MFAStepUpProvider>
+        </AuthModalProvider>
+      </AuthProvider>
+      {import.meta.env.DEV && <ReactQueryDevtools initialIsOpen={false} position="bottom" />}
+      <AnalyticsWrapper />
+    </QueryClientProvider>
+  );
+};
 
 export default App;