[fix](trx-frontend-http): fix SAT prediction page degrading whole-page rendering

Three issues in the satellite predictions view caused page-wide
rendering performance degradation:

1. Unbounded DOM nodes: All satellite passes (200+ satellites × multiple
   passes = 500-1000 rows with 5 spans each) were rendered at once,
   creating thousands of DOM nodes that slowed style recalculation and
   layout across the entire page. Now caps at 50 visible rows with a
   "Show more" button.

2. No DOM cleanup on view switch: Prediction rows persisted in the DOM
   when navigating away from the predictions view or the SAT tab,
   bloating the page DOM indefinitely. Now clears prediction DOM when
   leaving the predictions view or switching decoder tabs.

3. Countdown timer never paused: The 1-second setInterval with
   querySelectorAll kept running even when the predictions view was
   hidden, wasting CPU on invisible DOM queries. Now only runs when
   predictions view is active, caches element references instead of
   querying the DOM each tick, and auto-pauses when the view is hidden.

Also caches prediction DOM element references at module init instead
of calling getElementById on every render invocation.

https://claude.ai/code/session_01G6wuNCkckbHHsU7w5zCtW2
Signed-off-by: Claude <noreply@anthropic.com>
This commit is contained in:
Claude
2026-03-28 17:50:49 +00:00
committed by Stan Grams
parent 842ee6f076
commit 9920094008
2 changed files with 78 additions and 35 deletions
@@ -7680,6 +7680,10 @@ document.querySelectorAll(".sub-tab-bar").forEach((bar) => {
if (window.refreshCwTonePicker) window.refreshCwTonePicker();
});
}
// Clear SAT prediction DOM when leaving the SAT tab to reduce node count.
if (btn.dataset.subtab !== "sat" && typeof window.clearSatPredictionDom === "function") {
window.clearSatPredictionDom();
}
});
});