Reduce HF Spaces 429s: polling tuning and batched metric logs API (#513)

Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: 3 people

.changeset/polite-tigers-drop.md

@@ -0,0 +1,5 @@
+---
+"trackio": minor
+---
+
+feat:Reduce HF Spaces 429s: polling tuning and batched metric logs API

docs/source/track.md

@@ -55,6 +55,8 @@ If both a Space and a self-hosted URL are configured (`space_id` / `TRACKIO_SPAC
 
 For setup steps (running `trackio show`, binding to `0.0.0.0`, write tokens), see [Self-host the Server](self_hosted_server.md).
 
+The built-in dashboard polls for new runs and metrics every **1 second** on localhost and every **2 seconds** when opened on a Hugging Face Space (`*.hf.space`), to ease rate limits on the Space URL.
+
 ## Logging Data
 
 Once your run is initialized, you can start logging data using the [`log`] function:

trackio/frontend/src/App.svelte

@@ -20,6 +20,11 @@
     isStaticMode,
     setMediaDir,
   } from "./lib/api.js";
+  import {
+    getAppPollIntervalMs,
+    isRateLimitCooldownActive,
+    isTabHidden,
+  } from "./lib/hostPolling.js";
   import { setColorPalette } from "./lib/stores.js";
   import { getPageFromPath, navigateTo, getQueryParam } from "./lib/router.js";
   import Settings from "./pages/Settings.svelte";
@@ -159,9 +164,11 @@
     if (pollTimer) clearInterval(pollTimer);
     pollTimer = setInterval(async () => {
       if (!realtimeEnabled) return;
+      if (isTabHidden()) return;
+      if (isRateLimitCooldownActive()) return;
       await refreshRuns();
       await refreshAlerts();
-    }, 1000);
+    }, getAppPollIntervalMs());
   }
 
   function applyUrlTokens() {
@@ -382,6 +389,7 @@
           {showHeaders}
           {appBootstrapReady}
           {plotOrder}
+          {realtimeEnabled}
           bind:metricColumns
         />
       {:else if currentPage === "system"}
@@ -390,6 +398,7 @@
           selectedRuns={selectedRunRecords}
           {smoothing}
           {appBootstrapReady}
+          {realtimeEnabled}
           bind:availableDevices={availableSystemDevices}
           bind:selectedDevices={selectedSystemDevices}
         />

trackio/frontend/src/lib/api.js

@@ -1,4 +1,5 @@
 import * as staticApi from "./staticApi.js";
+import { registerRateLimitHit } from "./hostPolling.js";
 
 const BASE = window.__trackio_base || "";
 
@@ -47,6 +48,9 @@ export async function callApi(apiName, params = {}) {
     headers: { "Content-Type": "application/json", ...getOauthSessionHeader() },
     body: JSON.stringify(params),
   });
+  if (resp.status === 429) {
+    registerRateLimitHit();
+  }
   if (!resp.ok) {
     throw new Error(`API call ${apiName} failed: ${resp.status}`);
   }
@@ -85,6 +89,29 @@ export async function getLogs(project, run) {
   return await callApi("/get_logs", params);
 }
 
+export async function getLogsBatch(project, runs) {
+  if (await isStaticMode()) {
+    const out = [];
+    for (const run of runs) {
+      const logs = await staticApi.getLogs(project, run);
+      out.push({
+        run: run?.name ?? null,
+        run_id: run?.id ?? null,
+        logs,
+      });
+    }
+    return out;
+  }
+  const payload = {
+    project,
+    runs: runs.map((run) => ({
+      run: run?.name ?? null,
+      run_id: run?.id ?? null,
+    })),
+  };
+  return await callApi("/get_logs_batch", payload);
+}
+
 export async function getProjectSummary(project) {
   if (await isStaticMode()) return staticApi.getProjectSummary(project);
   return await callApi("/get_project_summary", { project });
@@ -114,6 +141,28 @@ export async function getSystemLogs(project, run) {
   return await callApi("/get_system_logs", params);
 }
 
+export async function getSystemLogsBatch(project, runs) {
+  if (await isStaticMode()) {
+    const out = [];
+    for (const run of runs) {
+      const logs = await staticApi.getSystemLogs(project, run);
+      out.push({
+        run: run?.name ?? null,
+        run_id: run?.id ?? null,
+        logs,
+      });
+    }
+    return out;
+  }
+  return await callApi("/get_system_logs_batch", {
+    project,
+    runs: runs.map((run) => ({
+      run: run?.name ?? null,
+      run_id: run?.id ?? null,
+    })),
+  });
+}
+
 export async function getSnapshot(project, run, step) {
   const params = { project, ...normalizeRun(run) };
   if (await isStaticMode()) return staticApi.getSnapshot(project, run, step);

trackio/frontend/src/lib/hostPolling.js

@@ -0,0 +1,29 @@
+let rateLimitCooldownUntil = 0;
+
+export function isHfSpaceHost() {
+  if (typeof window === "undefined") return false;
+  return (window.location.hostname || "")
+    .toLowerCase()
+    .endsWith(".hf.space");
+}
+
+export function registerRateLimitHit() {
+  const until = Date.now() + 12000;
+  rateLimitCooldownUntil = Math.max(rateLimitCooldownUntil, until);
+}
+
+export function isRateLimitCooldownActive() {
+  return Date.now() < rateLimitCooldownUntil;
+}
+
+export function getAppPollIntervalMs() {
+  return isHfSpaceHost() ? 2500 : 1000;
+}
+
+export function getMetricsPollIntervalMs() {
+  return isHfSpaceHost() ? 3500 : 1000;
+}
+
+export function isTabHidden() {
+  return typeof document !== "undefined" && document.hidden;
+}

trackio/frontend/src/pages/Metrics.svelte

@@ -5,7 +5,12 @@
   import BarPlot from "../components/BarPlot.svelte";
   import Accordion from "../components/Accordion.svelte";
   import LoadingTrackio from "../components/LoadingTrackio.svelte";
-  import { getLogs } from "../lib/api.js";
+  import { getLogsBatch } from "../lib/api.js";
+  import {
+    getMetricsPollIntervalMs,
+    isRateLimitCooldownActive,
+    isTabHidden,
+  } from "../lib/hostPolling.js";
   import {
     processRunData,
     getMetricColumns,
@@ -27,6 +32,7 @@
     showHeaders = true,
     appBootstrapReady = false,
     plotOrder = [],
+    realtimeEnabled = true,
     // eslint-disable-next-line no-useless-assignment -- bindable out-prop to parent
     metricColumns = $bindable([]),
   } = $props();
@@ -168,13 +174,21 @@
       return;
     }
 
-    let fetched = false;
-    for (const run of selectedRuns) {
+    const needFetch = selectedRuns.filter((run) => {
       const runKey = run.id ?? run.name;
-      if (!rawDataCache.has(runKey)) {
-        const logs = await getLogs(project, run);
-        rawDataCache.set(runKey, logs);
-        fetched = true;
+      return !rawDataCache.has(runKey);
+    });
+    let fetched = false;
+    if (needFetch.length > 0) {
+      try {
+        const batch = await getLogsBatch(project, needFetch);
+        for (const entry of batch) {
+          const runKey = entry.run_id ?? entry.run;
+          rawDataCache.set(runKey, entry.logs);
+          fetched = true;
+        }
+      } catch (e) {
+        console.error("Failed to load metric logs:", e);
       }
     }
 
@@ -185,20 +199,28 @@
   }
 
   async function refreshCachedRuns() {
+    if (!realtimeEnabled) return;
     if (!project || selectedRuns.length === 0) return;
+    if (isTabHidden()) return;
+    if (isRateLimitCooldownActive()) return;
 
-    let changed = false;
-    for (const run of selectedRuns) {
-      const logs = await getLogs(project, run);
-      const runKey = run.id ?? run.name;
-      const prev = rawDataCache.get(runKey);
-      if (!prev || logs.length !== prev.length) {
-        rawDataCache.set(runKey, logs);
-        changed = true;
+    try {
+      const batch = await getLogsBatch(project, selectedRuns);
+      let changed = false;
+      for (const entry of batch) {
+        const runKey = entry.run_id ?? entry.run;
+        const logs = entry.logs;
+        const prev = rawDataCache.get(runKey);
+        if (!prev || logs.length !== prev.length) {
+          rawDataCache.set(runKey, logs);
+          changed = true;
+        }
       }
-    }
-    if (changed) {
-      processFromCache();
+      if (changed) {
+        processFromCache();
+      }
+    } catch (e) {
+      console.error("Failed to refresh metric logs:", e);
     }
   }
 
@@ -230,7 +252,10 @@
         xLim = [lo, hi];
       }
     }
-    refreshTimer = setInterval(refreshCachedRuns, 1000);
+    refreshTimer = setInterval(
+      refreshCachedRuns,
+      getMetricsPollIntervalMs(),
+    );
     return () => {
       if (refreshTimer) clearInterval(refreshTimer);
     };