Caching

src/app/monitoring/page.tsx

@@ -31,10 +31,17 @@ export default function MonitoringPage() {
   const isMobile = useIsMobile();
 
   // Metrics polling every 30 seconds
-  const { value: metrics } = useAsyncInterval([], getMetrics, 30000, []);
+  const { value: metrics } = useAsyncInterval(
+    "metrics",
+    [],
+    getMetrics,
+    30000,
+    [],
+  );
 
   // Live nodes polling every 3 seconds
   const { value: liveData } = useAsyncInterval(
+    "liveNodes",
     { cpuUsage: 0, ramUsage: 0 },
     async () => {
       const nodes = await getLiveNodes();
@@ -44,11 +51,12 @@ export default function MonitoringPage() {
       };
     },
     3000,
-    []
+    [],
   );
 
   // Container stats
   const { value: containerStats } = useAsync(
+    "containerStats",
     [],
     async () => {
       const nodes = await getNodes();
@@ -61,18 +69,18 @@ export default function MonitoringPage() {
               const stats = await getContainerStats(c.Id);
               if (!stats) return undefined;
               return { ...stats, name: c.Names[0] };
-            })
-          )
+            }),
+          ),
         )
       ).filter((s): s is SimpleStats & { name: string } => s !== undefined);
     },
-    []
+    [],
   );
 
   const containerCPU = containerStats.reduce((acc, val) => acc + val.cpu, 0);
   const containerMemory = containerStats.reduce(
     (acc, val) => acc + val.memory,
-    0
+    0,
   );
 
   return (