Append real-time stats to CPU/RAM charts on each 15s tick
Zero extra Prometheus queries - reuses existing instant stats data to grow chart series between 60s range query refreshes. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -68,7 +68,28 @@ export function useEventStream() {
|
|||||||
es.addEventListener('stats', (e) => {
|
es.addEventListener('stats', (e) => {
|
||||||
try {
|
try {
|
||||||
const stats = JSON.parse(e.data);
|
const stats = JSON.parse(e.data);
|
||||||
setState(prev => ({ ...prev, stats }));
|
setState(prev => {
|
||||||
|
// Append latest stats as new chart data points (real-time feed)
|
||||||
|
if (prev.metrics) {
|
||||||
|
const now = Math.floor(Date.now() / 1000);
|
||||||
|
const sixHoursAgo = now - 6 * 3600;
|
||||||
|
const append = (series: Array<[number, number]>, value: number): Array<[number, number]> => {
|
||||||
|
const filtered = series.filter(([ts]) => ts > sixHoursAgo);
|
||||||
|
filtered.push([now, value]);
|
||||||
|
return filtered;
|
||||||
|
};
|
||||||
|
return {
|
||||||
|
...prev,
|
||||||
|
stats,
|
||||||
|
metrics: {
|
||||||
|
...prev.metrics,
|
||||||
|
cpu: append(prev.metrics.cpu, stats.cpu_percent),
|
||||||
|
ram: append(prev.metrics.ram, stats.ram_percent),
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
return { ...prev, stats };
|
||||||
|
});
|
||||||
} catch { /* ignore */ }
|
} catch { /* ignore */ }
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user