リフレッシュレート検証
メディア処理はすべてブラウザ内で完結します。データは送信されません
- フレーム数
- —
- 中央値フレーム
- —
- 最長フレーム
- —
- フレーム落ち
- —
⚠️ 計測しているのは**ブラウザーがこのページに与える合成フレームレート**で、モニターの箱に書かれた数字ではありません。両者が違うのは普通のことです:省電力設定、ケーブルの帯域不足(4K で 60 Hz 超はよくあります)、ディスプレイ側の同期設定、バックグラウンドタブの間引きなどが影響します。計測中はこのウィンドウを前面に置いてください。
⚠️ 測っているのはブラウザーがこのページに与える合成フレームレートで、モニターの箱に書かれた数字ではありません。両者が違うのは普通のことです:省電力モードのノート PC、帯域が足りないケーブル(4K で 60 Hz 超を HDMI 2.0 で、が典型例)、ディスプレイ側の同期モード、バックグラウンドタブの間引きなどで下がります。どれもエラーにはならず、「滑らかでない」と感じるだけです。 方法は単純で、`requestAnimationFrame` のコールバック頻度がそのまま合成器のフレームレートです。ただし素朴な実装では信頼できない点が二つあります。最初の数十フレームは遅い(ページが落ち着いておらず GPU も温まっていない)ことと、ブラウザーにタイマー精度の制限があることです。そこでここでは平均ではなく中央値を使います —— 一度の長い停止で、正常な 60 Hz が 30 Hz 以下に引きずられるためです。 また、数字が 60 Hz でも動いているときに滑らかとは限らないので、等速で動く四角も置いています。位置は時間の位相から計算するため、フレームが落ちると飛びます。ゆっくりずれるのではありません。処理はすべてローカルです。
機能
- 5 秒間の計測で、合成フレームレートを 24・30・48・50・60・75・90・120・144・165・240 の一般的な段階に丸めて表示します
- ⚠️ 平均ではなく中央値の間隔を使用。一度の停止で 60 Hz が 30 Hz になることはありません
- ⚠️ 最初の 1 秒(ウォームアップ)は捨てます。立ち上がり直後のフレームは代表値ではないためです
- フレーム数・中央値のフレーム時間・最長フレーム・フレーム落ち回数をすべて表示します
- フレーム落ちは「中央値の 1.5 倍を超えた」と定義。半分以上遅れると目に見えるためです
- 判定は三段階:安定/やや不安定/フレーム落ちあり
- 等速で動く四角で滑らかさを直接確認できます(落ちると飛びます)
- 処理はすべてブラウザ内で完結し、通信は行いません
使い方
- ウィンドウを前面に保ちます(バックグラウンドでは間引かれ、数値に意味がありません)
- 「計測する」を押して 5 秒待ちます
- 計測中に動く四角も見てください。数値と見た目が一致して初めて意味があります
- 見るべきは「最長フレーム」と「フレーム落ち」。中央値が正常でも最長が長ければ、散発的な引っかかりです
よくある質問
- モニターの仕様と違うのはなぜですか
- ここに出るのはブラウザーが実際にネゴシエートした値で、仕様はパネルの上限だからです。よくある差の理由:ケーブルの帯域不足(4K で 60 Hz 超を HDMI 2.0 で使うとクロマサブサンプリングか低いリフレッシュレートになります)、ディスプレイの省電力・同期モード、内蔵 GPU の出力上限、ブラウザーのバックグラウンド間引き。⚠️ ウィンドウが前面にないと計測値はほぼ無意味です。ブラウザーは不可視タブのフレームレートを意図的に下げます。
- 平均ではなく中央値を使うのはなぜですか
- 平均は外れ値に支配されるからです。計測にはほぼ必ず一度か二度の長い停止(ガベージコレクション、切り替えた瞬間、他のプロセスの CPU 使用)が含まれます。16.7 ミリ秒の間隔が 200 個あるところに 800 ミリ秒が 1 つ混じるだけで、平均は 30 Hz 以下に落ちますがパネルは正常です。中央値はそれに影響されません。だからこそ「最長フレーム」を別に表示しています —— あれが引っかかりの直接の証拠です。
- フレーム落ちはどう数えていますか
- そのフレームが中央値の 1.5 倍を超えたときに落ちたと数えます。半分以上遅れれば目に付く引っかかりになり、しきい値は厳しい側に倒しています。⚠️ 数えているのはこのページの落ちなので、ページ内でアニメーションが動いていればその負荷も含まれます。きれいな値を測りたいときは計測中にページを触らないでください。
- 動く四角は何のためですか
- 数値と体感は別物です。60 Hz が安定していれば等速で動く四角は滑らかに見えますが、フレームが落ちると飛びます —— 位置を時間の位相から計算しているので、時間が飛べば位置も飛ぶためです。普段スクロールやドラッグ、ゲームで感じているものに近いのはこちらです。四角は滑らかなのに数値が悪いなら散発的な引っかかり、四角がカクつくのに中央値が正常ならフレーム落ちの回数を見てください。
関連ツール
ドット抜けチェック
メディア黒・白・三原色・グレーで画面を塗りつぶし、輝点(stuck pixel)や欠点、画面の均一性の問題を探します。
ブラウザー情報
Webブラウザーがサイトに公開している情報を確認します。UA・画面・タイムゾーン・CPU コア数・WebGL レンダラーなど。すべて端末内で読み取り、送信しません。
HTML5 対応チェック
早見表いま使っているブラウザで HTML 要素・CSS の機能・ブラウザ API・メディア形式の対応状況を実測し、UA つきのレポートとしてコピーできます。
動画から GIF
メディア動画の一部を GIF に変換します。フレームレート・幅・色数・ループを指定でき、範囲はプレビューを見ながら選べます。動画は送信されません。
動画フレーム書き出し
メディア動画の指定した瞬間のフレームを、動画本来の解像度で PNG / JPEG / WebP として書き出します。スクリーンショットより鮮明です。
音声を WAV に
メディアMP3 / M4A / FLAC などを WAV に変換。サンプリング周波数(音声なら 16k、映像なら 48k)、モノラル化、ピーク正規化に対応。すべてブラウザ内で完結します。