Mirror/intercept
1
0
Fork 0
mirror of https://github.com/smittix/intercept.git synced 2026-06-08 06:01:56 -07:00
Code Issues Packages Projects Releases Wiki Activity

Fix browser freeze with many aircraft by batching UI updates

Browse Source 
Use requestAnimationFrame to throttle expensive rendering operations.
Previously every SSE message triggered full UI re-renders causing
browser unresponsiveness with 50+ aircraft.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
James Smith
2025-12-25 08:47:16 +00:00
parent 3ee9f5e749
commit ef66929848
1 changed files with 31 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/adsb_dashboard.html
+31 -11
View File
@@ -759,6 +759,32 @@
}
}
// Throttle expensive UI operations to prevent browser freeze
let pendingUIUpdate = false;
let pendingMarkerUpdates = new Set();
function scheduleUIUpdate() {
if (pendingUIUpdate) return;
pendingUIUpdate = true;
requestAnimationFrame(() => {
updateStats();
renderAircraftList();
// Batch marker updates
for (const icao of pendingMarkerUpdates) {
updateMarkerImmediate(icao);
}
pendingMarkerUpdates.clear();
// Update selected aircraft panel
if (selectedIcao && aircraft[selectedIcao]) {
showAircraftDetails(selectedIcao);
}
pendingUIUpdate = false;
});
}
function updateAircraft(data) {
const icao = data.icao;
if (!icao) return;
@@ -770,22 +796,16 @@
lastSeen: Date.now()
};
// Update marker on map
// Queue marker update
if (data.lat && data.lon) {
updateMarker(icao);
pendingMarkerUpdates.add(icao);
}
// Update UI
updateStats();
renderAircraftList();
// Update selected aircraft panel
if (selectedIcao === icao) {
showAircraftDetails(icao);
}
// Schedule batched UI update
scheduleUIUpdate();
}
function updateMarker(icao) {
function updateMarkerImmediate(icao) {
const ac = aircraft[icao];
if (!ac || !ac.lat || !ac.lon) return;