# Display System Stats

Use `useSystemMonitor()` to subscribe to real-time CPU usage, memory usage, network throughput, and battery state.

## Basic usage

```tsx
import { useSystemMonitor } from "@fluxlay/react";

function Monitor() {
  const { cpuUsage, memoryUsage } = useSystemMonitor();

  return (
    <div style={{ color: "white", padding: 24 }}>
      <div>CPU: {cpuUsage.toFixed(1)}%</div>
      <div>RAM: {memoryUsage.toFixed(1)}%</div>
    </div>
  );
}
```

## Per-core CPU usage

```tsx
function CpuPerCore() {
  const { cpuPerCore } = useSystemMonitor();

  return (
    <div style={{ display: "flex", gap: 4 }}>
      {cpuPerCore.map((usage, i) => (
        <div key={i} style={{ width: 8, height: 64, background: "#333", position: "relative" }}>
          <div
            style={{
              position: "absolute",
              bottom: 0,
              width: "100%",
              height: `${usage}%`,
              background: "#0f0"
            }}
          />
        </div>
      ))}
    </div>
  );
}
```

## Tune polling intervals

Each category has its own polling interval. Sample fast-changing values frequently and slow-changing values rarely to save battery.

```tsx
const info = useSystemMonitor({
  cpuIntervalMs: 500, // 0.5s (frequent)
  memoryIntervalMs: 1000, // 1s
  diskSpaceIntervalMs: 60000, // 1 minute (rare)
  batteryIntervalMs: 30000 // 30s
});
```

## Battery state

Get battery level and charging state on laptops.

```tsx
function Battery() {
  const { batteryLevel, batteryCharging } = useSystemMonitor();

  if (batteryLevel === null) {
    return null; // No battery on desktop machines
  }

  return (
    <div>
      {batteryCharging ? "⚡" : "🔋"} {batteryLevel.toFixed(0)}%
    </div>
  );
}
```

## Notes

- All values return `0` or `null` until the first sample arrives.
- Aggressive polling intervals increase CPU and battery usage.
- CPU usage, memory usage, and battery level are percentages in `0.0 – 100.0`. Disk I/O and network are returned as bytes/sec.

See the [useSystemMonitor Reference](/en/studio/developer/reference/sdk/use-system-monitor.md) for full API details.
