useSystemMonitor

Fluxlay デスクトップアプリからストリーミングされるシステム＆ハードウェア情報をサブスクライブします。サイバーパンク風 HUD やシステムモニター壁紙の構築に使用します。

インポート

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

シグネチャ

function useSystemMonitor(options?: SystemMonitorOptions): SystemMonitorInfo;

引数

SystemMonitorOptions

各カテゴリのポーリング間隔をミリ秒単位で指定します。省略したフィールドにはデフォルト値が使われます。

プロパティ	型	デフォルト	説明
`cpuIntervalMs`	`number`	`500`	CPU 使用率、コア別使用率、周波数。
`memoryIntervalMs`	`number`	`1000`	メモリとスワップの使用状況。
`networkIntervalMs`	`number`	`1000`	ネットワーク受信/送信速度。
`diskIoIntervalMs`	`number`	`2000`	ディスク読み書き速度。
`diskSpaceIntervalMs`	`number`	`30000`	マウントポイントごとのディスク容量。
`batteryIntervalMs`	`number`	`10000`	バッテリー残量と充電ステータス。
`processIntervalMs`	`number`	`10000`	実行中のプロセス数。
`loadAverageIntervalMs`	`number`	`5000`	システムのロードアベレージ。

間隔を短くするとデータの反応性が上がりますが、CPU 使用率が増加します。壁紙の用途に合わせてバランスを調整してください。

戻り値

CPU

プロパティ	型	説明
`cpuUsage`	`number`	CPU 全体の使用率（0.0 – 100.0）。
`cpuPerCore`	`number[]`	コアごとの使用率（0.0 – 100.0）。
`cpuFrequencyMhz`	`number[]`	コアごとの現在クロック周波数（MHz）。

メモリ

プロパティ	型	説明
`memoryTotal`	`number`	物理メモリ合計（バイト）。
`memoryUsed`	`number`	物理メモリ使用量（バイト）。
`memoryUsage`	`number`	メモリ使用率（0.0 – 100.0）。
`swapTotal`	`number`	スワップ合計（バイト）。
`swapUsed`	`number`	スワップ使用量（バイト）。
`swapUsage`	`number`	スワップ使用率（0.0 – 100.0）。

バッテリー

プロパティ	型	説明
`batteryLevel`	`number \| null`	バッテリー残量（0.0 – 100.0）。バッテリーがなければ `null`。
`batteryCharging`	`boolean \| null`	充電中かどうか。バッテリーがなければ `null`。

ネットワーク

プロパティ	型	説明
`networkRxBytesPerSec`	`number`	ネットワーク受信速度（バイト/秒）。
`networkTxBytesPerSec`	`number`	ネットワーク送信速度（バイト/秒）。

ディスク

プロパティ	型	説明
`diskReadBytesPerSec`	`number`	ディスク読み取り速度（バイト/秒）。
`diskWriteBytesPerSec`	`number`	ディスク書き込み速度（バイト/秒）。
`disks`	`DiskInfo[]`	マウントポイントごとのディスク容量情報。

DiskInfo:

プロパティ	型	説明
`mountPoint`	`string`	マウントポイント（例: `"/"`）。
`name`	`string`	ディスク名。
`totalBytes`	`number`	合計容量（バイト）。
`availableBytes`	`number`	空き容量（バイト）。
`usage`	`number`	使用率（0.0 – 100.0）。

システム情報

プロパティ	型	説明
`loadAverage`	`[number, number, number]`	ロードアベレージ（1 分 / 5 分 / 15 分）。
`processCount`	`number`	実行中のプロセス数。
`uptimeSecs`	`number`	システム起動からの経過時間（秒）。
`hostname`	`string`	ホスト名。
`osName`	`string`	OS 名とバージョン。
`cpuBrand`	`string`	CPU モデル名（例: `"Apple M2 Pro"`）。
`physicalCoreCount`	`number`	物理コア数。
`logicalCoreCount`	`number`	論理コア数。
`cpuArch`	`string`	CPU アーキテクチャ（例: `"aarch64"`）。
`kernelVersion`	`string`	カーネルバージョン。

使用例

function Wallpaper() {
  const { cpuUsage, memoryUsage, batteryLevel, batteryCharging } = useSystemMonitor({
    cpuIntervalMs: 500,
    memoryIntervalMs: 1000,
    batteryIntervalMs: 10000
  });
 
  // CPU 負荷に応じて背景色を変化
  const bg = cpuUsage > 80 ? "#1a0000" : "#000a1a";
 
  return (
    <div style={{ background: bg, color: "white", padding: 32, fontFamily: "monospace" }}>
      <p>CPU: {cpuUsage.toFixed(1)}%</p>
      <p>Memory: {memoryUsage.toFixed(1)}%</p>
      <p>
        Battery: {batteryLevel !== null ? `${batteryLevel.toFixed(0)}%` : "N/A"}
        {batteryCharging ? " ⚡" : ""}
      </p>
    </div>
  );
}

useProperties と組み合わせる

useProperties と組み合わせることで、エンドユーザーがポーリング間隔を変更できるようになります。

function Wallpaper() {
  const props = useProperties();
  const info = useSystemMonitor({
    cpuIntervalMs: props.cpuInterval as number
  });
  // ...
}

備考

各カテゴリは設定された間隔でのみ refresh と値の読み取りが行われます。間隔外のティックではキャッシュ値が使われます。
データの更新がないティックではストリームへの送信がスキップされるため、受信頻度は設定した最短間隔と一致します。
ホスト名、OS 名、CPU モデル等の静的情報はアプリ起動時に 1 回だけ取得され、以降は変化しません。
モニタリングは最初のサブスクライバー接続時に開始し、全てのサブスクライバー切断時に停止します。
このフックは Fluxlay デスクトップアプリ内でのみ動作します。通常のブラウザでは初期値のゼロ値を返します。
options の値が変更されると、ストリームが自動的に再接続されます。