LCPを改善 | 項目 | 状態 | |------|------| | LCP対象画像の優先読み込み不足 | 適用済み（26c559d: fetchpriority=high + loading=eager + rel=preload。キュー待ち 27.5ms → 5.4ms） | | 画像の最適化① LCP画像のサイズ | 該当なし（7,256B・全体の0.08%。uses-responsive-images 非検出＝寸法適正） | | 画像の最適化② WebP変換 | 適用済み（e7ac9a8: ファーストビュー20件を 42,896B → 22,614B、-47.3%） | | 画像の最適化③ フォーマット選択 | 適用済み（e7ac9a8に統合。20件全件で lossless / q85 を実測比較し小さい方を採用。19件で lossless が最小） | | 不要な画像① ファーストビュー外の直読み込み | 適用済み（f58297d: 2件195,810B に loading=lazy。区間の画像バイト -81.0%） | | 不要な画像② PC用画像の読み込み | 該当なし（_pc / /pc/ / picture / source / srcset いずれも0件） | | 海外サーバーからの配信（レア） | 該当なし（peachjohn.co.jp の140件全件 x-amz-cf-pop: NRT20-P6 = CloudFront東京） | | コミット | ブランチ | 親 | プラクティス | LCP中央値 | 採否 | |---|---|---|---|---|---| | 26c559d | lcp/priority-hint | 3fcb386 | LCP画像の優先読み込み | 129.0ms | 採用 | | f58297d | lcp/lazy-belowfold-images | 26c559d | ファーストビュー外画像2件の遅延読み込み化 | 116.0ms | 採用 | | e7ac9a8 | lcp/firstview-webp | f58297d | ファーストビュー画像20件のWebP化 | 105.0ms | 採用 | | 49db1a8 | lcp/inline-lcp-image | 3fcb386 | LCP画像の data URI インライン化 | 76.0ms | 採用（側枝） | メインラインは 26c559d → f58297d → e7ac9a8 の直列。49db1a8 は P1〜P3 の排他的代替として 3fcb386 を親とする側枝で、main には統合していない。 1. data URI インライン化（49db1a8）が単独で他3件の合計を上回った（76.0ms vs 105.0ms）。observed で LCP = FCP = 3,333.3ms（LCP−FCP が 0ms に）、LCP候補が3個→1個。「画像がレイアウト確定前に到着すればレンダー遅延が吸収される」ことを実証。ただし LCP画像が7.3KBだから成立する条件付き手法（HTML転送 +20.7%、data URI はキャッシュ不可） 2. ファーストビュー外画像の遅延読み込み化（f58297d）では、レグレッションテストでは検出できない不具合を機能検証で発見・修正した。loading=lazy のみの初回実装は Diff 9.7138%（合格）でありながら、親 a 要素が display:inline-block のため未読込時に画像の箱が幅20px・高さ0に潰れ、ページ全高が471px縮んでいた。width/height 属性も aspect-ratio も機能しない。親に display:block を追加して解決 3. WebP化の判断軸は「線画か写真か」ではなく「元が既に非可逆圧縮されているか」。mv_logo.jpg は線画調だが元が lossy JPEG のため lossless では逆に増える（+0.5%） 4. 優先度を Medium → High にしてキュー待ちは -80% になったが、受信時間 86.8ms はほぼ不変（85.3ms）。これが帯域競合の除去（f58297d）の必要性を実測で裏付けた 5. simulated と observed で LCP − FCP がほぼ一致（98.0ms / 95.9ms）。TTFB 3,260ms は FCP到達前に全額消費される共通コストで LCP−FCP に含まれないため、このフェーズで削減できる領域は約96〜98msの区間に限定されると特定した - HTMLのTTFB 3,258ms（server-response-time score 0）は本フェーズの対象外（サーバ改修領域） - /optimize-images によるサイト全体のWebP化（ファーストビュー20件のみ実施済み） - 商品画像の過大サイズ（uses-optimized-images 180KiB） - アイコンの二重取得 LCP: 105ms（中央値） CLS: 0.000 TBT: 0ms FCP: 57ms SI: 1858ms Overall Score: 100 LCP 140.5ms → 105.0ms（-25.3%） observed の LCP − FCP は 95.9ms → 70ms