diff --git a/src/App.jsx b/src/App.jsx
index 6a3ba4a..b22f645 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -11,18 +11,29 @@ const Manifesto = lazy(() => import('./pages/Manifesto'));
 
 function App() {
   useEffect(() => {
-    reportWebVitals(console.log);
-    
     if ('performance' in window) {
       window.performance.mark('app_start');
     }
+    
+    const logWebVitals = (metric) => {
+      console.log('Web Vital:', metric);
+      if (metric.value > 0) {
+        console.log('Metric details:', {
+          name: metric.name,
+          value: metric.value,
+          rating: metric.rating
+        });
+      }
+    };
+
+    reportWebVitals(logWebVitals);
   }, []);
 
   return (
     <ErrorBoundary>
       <Router>
-        <Canvas />
         <Suspense fallback={<LoadingState />}>
+          <Canvas />
           <Routes>
             <Route path="/" element={<Home />} />
             <Route path="/manifesto" element={<Manifesto />} />