1フレームは何秒・何ms? 60fps / 120fps のミリ秒計算とアニメーション描画バジェット
FPS パフォーマンス ゲーム開発 アニメーション フロントエンド
結論:30秒で FPS フレームバジェットを把握する
- 60fps (標準): 1フレーム = 約16.67ms(JS実行許容時間 ≒ 10ms以内)
- 120fps (ハイリフレッシュ): 1フレーム = 約8.33ms(JS実行許容時間 ≒ 4ms以内)
- 30fps (モバイル制限時): 1フレーム = 約33.33ms
- 計算器: 下のツールで任意の FPS をミリ秒に即時換算
1. オンライン FPS ↔ ミリ秒 (ms) 換算計算機
FPS 数値を入力することで、1 フレームあたりの描画ミリ秒数と 1 秒あたりの全フレーム数をリアルタイムに算出します。
⏱️ この場でFPSからミリ秒を計算する
目標FPS → フレームタイム
または FPS
1フレームあたりの時間 16.67 ms
1秒あたりのフレーム数 60
1フレームは何秒 0.0167 秒
逆引き: この処理時間で必要なFPS
2. 主要 FPS と 1 フレーム許容時間の比較
| フレームレート (FPS) | 1フレームの時間 (ms) | 主な用途・環境 |
|---|---|---|
| 24 fps | 41.67 ms | 映画・一般的なアニメーション |
| 30 fps | 33.33 ms | 一部モバイルゲーム・低負荷設定 |
| 60 fps | 16.67 ms | 標準的な Web サイト・標準モニター |
| 120 fps | 8.33 ms | ハイリフレッシュレートスマホ・ゲーミング PC |
| 144 fps | 6.94 ms | eスポーツ向けゲーミングモニター |
3. 注意点(ハマりどころ)
- Jank(コマ落ち)の原因となる Long Task
- 60fps を維持するには 16.67ms 以内に処理を終える必要がありますが、Main Thread で 50ms 以上の Task(Long Task)が発生すると、画面がフリーズして視覚的なカクつき(Jank)と INP(Interaction to Next Paint)悪化の原因になります。