ファーストビュー性能

ファーストビュー資産チェック

最初の画面の CSS、フォント、画像、スクリプトを一覧し、ブロック、遅延ヒーロー、フォント、サードパーティのリスクを採点します。

未開始0/100

資産0

ブロック0

外部0

未完了の重要項0

ページ情報

引き継ぎ用レポートに残すページの文脈を入力します。

ページ名ページ種別主なビューポート

メモ

詳細、HTML、資産リストはこのブラウザ内に留まります。

HTML スナップショット

任意。head とファーストビューのマークアップを貼って抽出します。

ファーストビュー資源リスト

抽出結果を編集するか手で追加します。サイズは画像予算の任意入力です。

HTML を抽出するか資産を追加してください。

リスト上のリスク

資源リストのヒューリスティックであり、Lighthouse のラボ結果ではありません。

資産を追加すると採点します。

手動確認

HTML だけでは分からない fetchpriority、font-display、インライン CSS、遅延ウィジェットを確認します。

LCP ヒーローを特定した重要モバイルとデスクトップの LCP 要素がどの画像またはテキストか分かっています。ヒーローは遅延読み込みしていない重要LCP 画像は eager で、カルーセルやクライアント描画の後ろにありません。ヒーローがサイズ予算内重要表示サイズは CSS × DPR に近く、多くの場合 150〜200 KB を十分下回ります。font-display を設定した重要ファーストビューフォントは swap または optional で、文字が見える状態を保ちます。重要フォントをプリロードした推奨ファーストビューのフォントだけを、type と crossorigin を合わせてプリロードします。ファーストビュー CSS を抑えた重要クリティカル CSS は小さいかインラインで、フレームワーク CSS を全部ブロックしていません。非重要 JS を遅延した重要アプリ、解析、A/B スクリプトは defer / async、または初回描画後に読み込みます。チャットとタグを遅延した推奨チャット、ヒートマップ、余分なピクセルはファーストビューで読み込みません。