fix: fetch sparkline/chart immediately on SSE ping, no debounce delay

This commit is contained in:
M1 2026-03-17 07:12:48 +04:00
parent b802c7c68b
commit 94d24bac35
2 changed files with 20 additions and 28 deletions

View File

@ -265,18 +265,16 @@
} }
}); });
// SSE: account stream filtered to this monitor — refresh chart on ping // SSE: on ping for this monitor, fetch fresh chart
let _chartRefreshTimer = null; let _fetchingChart = false;
watchAccount((ping) => { watchAccount(async (ping) => {
if (ping.monitor_id !== monitorId) return; if (ping.monitor_id !== monitorId || _fetchingChart) return;
if (_chartRefreshTimer) return; _fetchingChart = true;
_chartRefreshTimer = setTimeout(async () => {
_chartRefreshTimer = null;
try { try {
const res = await fetch(`/dashboard/monitors/${monitorId}/chart`, { credentials: 'same-origin' }); const res = await fetch(`/dashboard/monitors/${monitorId}/chart`, { credentials: 'same-origin' });
if (res.ok) document.getElementById('latency-chart').innerHTML = await res.text(); if (res.ok) document.getElementById('latency-chart').innerHTML = await res.text();
} catch {} } catch {}
}, 5000); _fetchingChart = false;
}); });
</script> </script>

View File

@ -75,25 +75,19 @@
} catch {} } catch {}
}, 30000); }, 30000);
// Sparkline refresh — debounced per monitor (at most once per 5s) // SSE: on each ping, fetch fresh sparkline for that monitor
const _sparklineTimers = {}; const _fetchingSparkline = new Set();
function scheduleSparklineRefresh(mid, sparkEl) { watchAccount(async (ping) => {
if (_sparklineTimers[mid]) return;
_sparklineTimers[mid] = setTimeout(async () => {
delete _sparklineTimers[mid];
try {
const res = await fetch(`/dashboard/monitors/${mid}/sparkline`, { credentials: 'same-origin' });
if (res.ok) sparkEl.innerHTML = await res.text();
} catch {}
}, 5000);
}
// SSE: single account stream — refresh sparkline for the relevant card on each ping
watchAccount((ping) => {
const card = document.querySelector(`[data-monitor-id="${ping.monitor_id}"]`); const card = document.querySelector(`[data-monitor-id="${ping.monitor_id}"]`);
if (!card) return; if (!card) return;
const sparkEl = card.querySelector('.stat-sparkline'); const sparkEl = card.querySelector('.stat-sparkline');
if (sparkEl) scheduleSparklineRefresh(ping.monitor_id, sparkEl); if (!sparkEl || _fetchingSparkline.has(ping.monitor_id)) return;
_fetchingSparkline.add(ping.monitor_id);
try {
const res = await fetch(`/dashboard/monitors/${ping.monitor_id}/sparkline`, { credentials: 'same-origin' });
if (res.ok) sparkEl.innerHTML = await res.text();
} catch {}
_fetchingSparkline.delete(ping.monitor_id);
}); });
</script> </script>