shadcn.io is not affiliated with official shadcn/ui
System Load Average Monitoring Block for Svelte
The 1, 5 and 15 minute load of one Linux host over the last hour against a dashed ceiling at its core count, a core-count select, a Load or Per core axis and a verdict worked out from the three latest values.
Installation
Overview
Read whether a host is busy for its size with this load chart for Svelte with Ark UI. It is Loadwhistle, a host monitor, and the header is worked out from the latest readings: "10.82 on db-eu-2, which has 8 cores: 1.35 per core, rising". In a hairline frame with a plus mark on each corner, three lines (1, 5 and 15 minutes, told apart by weight and dash, never by colour) run over the last 60 minutes on one axis, with a dashed ceiling at the core count labelled "8 cores: fully busy". A native select in the header changes how many cores the host has, which moves the ceiling and the per-core figures, and two radios switch the axis between the load itself and the load per core. A verdict ("Rising: 1 minute above 5 minutes above 15 minutes") sits above the three latest values, the 1 minute load per core, context switches and interrupts. Guides draw the frame and its bands; the entrance is CSS only. For Linux hosts, build runners and any service where a load of 10 means different things on 4 and 16 cores.
FAQ
How do I load my own readings?
The three lines are worked out the way the kernel keeps them. queueOf returns the run queue for each minute and samplesOf folds it into the 1, 5 and 15 minute averages with the decay factors 0.3679, 0.8187 and 0.9355. Replace queueOf with your own per-minute run queue, or fill SAMPLES with the averages your host reports (/proc/loadavg), and keep AS_OF_MINUTES as the time of the last sample.
What does the core count change?
It moves the dashed ceiling and the axis top (room above both the ceiling and the peak), divides the latest figures for the per-core reading, and rewrites the header sentence. The lines themselves do not change, because load is a count of runnable processes, not a percentage of the machine.
How is the verdict decided?
From the three latest values only: rising when the 1 minute value is above the 5 minute value and that is above the 15 minute value, falling when they are in the opposite order, and steady otherwise. Change trendOf to add a margin if your readings are noisy.
Is anything measured here?
No. The run queue is a typed formula with fixed numbers and nothing reads your machine or a network; the status line says so. The context switches and interrupts are typed beside the lines. In your app read the three averages from /proc/loadavg (or your agent) and the core count from nproc.
What does a screen reader get?
The chart is hidden from assistive technology and a caption says what it shows: for each line its first reading, its peak and its latest, against the core ceiling. The three latest values are also in the list below, and the status line names the new core count or axis after you change them.