Softonic

FPS カウンター

ステップ 1 / 3 現在の FPS
秒
フレーム
FPS
次へ

この FPS カウンターを使うと、現在のページをブラウザーがどれだけなめらかに描画しているかを測定できます。requestAnimationFrame でフレームをサンプリングし、現在・平均・最小・最大の FPS を表示。短いグラフも描けるので、重いタブやアニメーション、拡張機能、スロットリング、ディスプレイ設定によるカクつきの落ち込みを見つけられます。

ブラウザーの FPS を測定する手順

  1. 1

    測定時間を選ぶ

    5 秒が使いやすい初期値です。周期的なカクつきやバックグラウンド負荷の変化を捉えたい場合は、測定時間を長めにしてください。

  2. 2

    平滑化と警告しきい値を設定する

    平滑化ウィンドウは直近のフレームを平均します。しきい値は、テストする端末で許容できると考える FPS の水準を示します。

  3. 3

    カウンターを実行してばらつきを読む

    現在の FPS は直近の描画速度を示します。平均・最小・最大の値から、セッション全体が安定してなめらかだったか、目に見える落ち込みがあったかがわかります。

FPS カウンターが測定するもの

このツールが測るのはブラウザーの描画テンポであり、グラフィックスカードのベンチマーク性能ではありません。ブラウザーが次のフレームを描画できる状態になるたびに、requestAnimationFrame がサンプラーを呼び出します。2 回のコールバックの間隔から、瞬間フレームレートが求まります。

FPS = 1000 / frame_time_in_ms

表示される現在の FPS は、平滑化ウィンドウ上の移動平均です。60 フレームのウィンドウは一般的な 60 Hz ディスプレイに適しており、単発のスパイクを抑えつつ、継続的な低下は隠しません。ウィンドウが小さいほど反応が速く、大きいほど安定して見えます。

具体例

5 秒間の測定で、次のような簡略化したフレーム間隔が記録されたとします。

フレーム間隔 瞬間 FPS 示唆される状態
16.7 ms 59.9 FPS 60 Hz の一般的な描画
8.3 ms 120.5 FPS 120 Hz の一般的な描画
25.0 ms 40.0 FPS 多くのディスプレイで体感できる速度低下
33.3 ms 30.0 FPS 高負荷またはスロットリング

警告しきい値が 50 FPS で、測定した移動平均が 47 FPS で終わった場合、一部のフレームが速くても結果は目標を下回ります。60 FPS 付近で終わりつつ、ときどき 45 FPS まで落ちる場合は、平均は良好ですが、最小値は調べる価値のあるカクつきがあったことを示しています。

結果の読み方

結果のパターン 考えられる原因 次に確認すること
平均がリフレッシュレートに近く、落ち込みがまれ 描画は良好 必要なときだけ別のブラウザーと比較する
平均は良いが、最小値が大きく低い 周期的なカクつき 重いタブを閉じるか、アニメーションを確認する
平均がしきい値を下回る 描画負荷が継続している CPU 使用率、拡張機能、ページのスクリプトを確認する
FPS が 30 付近で頭打ち 省電力またはスロットリング バッテリーモードとディスプレイ設定を確認する

ブラウザーの FPS は、ディスプレイのリフレッシュレート、OS のコンポジター、バッテリーモード、熱によるスロットリング、開いているタブ、そしてページ自体の影響を受けます。まず何も動いていないタブでテストし、その後、診断したいページやアプリを動かした状態でもう一度測定してください。

よくある質問

いいえ。このカウンターは、ブラウザーが requestAnimationFrame のコールバックを受け取る頻度を測ります。Web アニメーションやページのなめらかさの確認には役立ちますが、ネイティブゲーム向けの本格的な GPU ベンチマークではありません。

ほとんどのブラウザーは、アニメーションのフレームをディスプレイのリフレッシュレートに合わせます。60 Hz のモニターでは通常 60 FPS 前後になり、120 Hz や 144 Hz のディスプレイでは、ブラウザーと OS が許可すればより高い値が出ることがあります。

60 Hz でのなめらかさを確認するなら 50 FPS が目安です。高リフレッシュレートのモニターでは、期待する体験に近い値、たとえば 90 FPS や 120 FPS に設定してください。

いいえ。測定はローカルの計時 API を使ってブラウザー内で完結します。フレームのデータやスクリーンショット、端末情報を外部の API に送信することはありません。

関連ツール

ASCII表リファレンス

0から127までの完全なASCII表です。NUL、LF、DELなどの制御コードを含め、各文字の10進数、16進数、8進数、2進数、HTML数値文字参照を表示します。

HTML文字参照

HTMLエンティティの検索可能なリスト、その名称コードおよび数値コード、および特殊文字や記号のワンクリックコピー機能を提供します。

キーボードショートカット一覧

macOS、Windows、Linux向けに、VS Code、Chrome、GNU Readlineを使うBashの公式資料に基づく既定ショートカットを検索できます。

JavaScript圧縮ツール

変数名のリネーム、空白の削除、デッドコードの除去、定数畳み込みでJavaScriptを圧縮し、より小さなバンドルを作成します。

EditorConfig ジェネレーター

インデントのスタイルとサイズ、改行コード、文字コード、空白ルールを指定して .editorconfig ファイルを生成し、IDE やエディタをまたいで書式を統一できます。

メールアドレス検証ツール

メールアドレスを検証します。RFC 5322構文チェック、MXレコードのライブ確認に加え、ローカル部、ドメイン、長さの詳細を表示します。メールは送信されません。

このツールは他の言語でも利用できます