useFps

輕鬆跟蹤 FPS

useFps 透過計算 requestAnimationFrame 回呼來測量當前的每秒幀數。它回傳一個表示當前 FPS 的數字，在可設定的幀數上計算（預設：每 10 幀）。這對於效能監控和自適應渲染非常有用。

使用場景

• 在開發或除錯覆蓋層中顯示即時 FPS 計數器
• 當幀率降到閾值以下時自適應地降低動畫複雜度
• 對元件或頁面的渲染效能進行基準測試

注意事項

• SSR 安全：在伺服器端渲染時回傳 0。伺服器上不會發生 requestAnimationFrame 呼叫。
• 效能：此 hook 內部使用 requestAnimationFrame，開銷極小。調整 every 選項以平衡精確度和更新頻率。
• 相關 hooks：另請參閱 useIdle 用於偵測使用者閒置狀態，可與基於 FPS 的自適應渲染互補。

Usage

function Demo() {
  const fps = useFps();

  return <div>FPS: {fps}</div>;
};

API

useFps

Returns

number: 每秒幀數

Arguments

UseFpsOptions