タグ

タグを使用すると、履歴内の特定のポイントを重要なものとしてマークできます

  • 補足施策

    735388f7 · Google Fonts（Montserrat）の廃止とシステムフォントへの代替 · 
    補足施策

| 項目 | 状態 |
|------|------|
| WebP最適化 | 実施済み（8207ec1: 残り72件、8,848,523B → 3,900,702B） |
| JS最適化 第1段階（body末尾移動） | 実施済み（6f11000: script 36個を移動。FCP 55→62ms と逆効果であることを9回計測で実証） |
| JS最適化 第2段階（async付与） | 実施済み（47cc216: 外部30スクリプトを静的解析し候補2要素に絞り込み。効果ゼロを実測で確定） |
| CSS結合 | FCPフェーズ c2661fa / f8b7d6a で実施済みのためスキップ（結合グループの相違を根拠として記録） |
| TTFB 50msシミュレーション | エージェント定義で廃止。追加検証項目「TTFBの対策検討」として側枝 2fb33dc で参考検証（main には未マージ） |

| 項目 | 状態 |
|------|------|
| HTMLファイルサイズ | 適用済み（bf95a87: 384,102B → -62.5%） |
| 不要なHTML要素 | 該当なし（コメント・空白は実測1KB未満） |
| スライダー・リスト数の制限 | 適用済み（bf95a87: 初期非表示タブパネル5枚を外部フラグメント化） |
| 初期非表示要素の遅延読み込み | 適用済み（bf95a87）。.block-menu は操作依存で検証再現性が落ちるため意図的に対象外 |
| TTFB計測 | 実施済み（ttfbMs 3,255ms。同一オリジンの実測中央値39msと比較） |
| TTFB対策検討 | 実施済み（側枝 2fb33dc で定量化） |
| ネットワーク速度の現状確認 | 該当なし（network-rtt 0.306ms。判定目安50msを163倍下回る） |
| 高速回線シミュレーション | 該当なし（上記により条件不成立） |
| 未使用CSS検出 | 実施済み（Puppeteerカバレッジ + purgecss の二系統） |
| CSSパージ実施 | 適用済み（e6ad4de: 和集合方式で 3,058 → 1,204 ルール、45KiB → 19KiB） |
| Google Fontsをやめる | 適用済み（735388f。Diff 9.7281% で VRT特例を使わず通常合格） |
| 日本語Webフォントをやめる | 該当なし（woff2 は Montserrat 1件のみ。Noto Sans JP は @font-face 0件で実体なし） |

| コミット | プラクティス | Score | 転送量(KiB) | DOM | 採否 |
|---|---|---|---|---|---|
| 8207ec1 | サイト全体の画像のWebP化（72件） | 100 | 1457 | 3777 | 採用 |
| 6f11000 | script 36個の body末尾移動 | 100 | 1456 | 3804 | 採用（FCPに逆効果） |
| 47cc216 | lazysizes への async 付与 | 100 | 1456 | 3804 | 採用（効果なし） |
| 1f562bf | ajaxヘッダの二重取得解消 | 100 | 1452 | 3804 | 採用 |
| 5e83c74 | 検索アイコンの二重取得解消 | 100 | 1451 | 3804 | 採用 |
| e6ad4de | 未使用CSSのパージ | 100 | 1426 | 3804 | 採用 |
| bf95a87 | 初期非表示タブパネル5枚の遅延化 | 100 | 1414 | 1585 | 採用 |
| d5de41c | 過大サイズ商品画像の適正化 | 100 | 672 | 1585 | 採用 |
| 735388f | Google Fonts 廃止 | 100 | 636 | 1585 | 採用 |
| 2fb33dc | TTFB 3255→50ms シミュレーション | 100 | 636 | 1585 | 採用（側枝。main には未マージ） |

全10プラクティス採用、不採用0件。フォーカス指標 Overall Score は全10プラクティス・全55回の playback で100を維持。

- 総転送量 2,820 KiB → 636 KiB（-77.4%）、DOM 3,777 → 1,585要素（-58%）、リクエスト 92 → 88
- 失格監査の解消: modern-image-formats / uses-optimized-images / total-byte-weight（8207ec1）、uses-responsive-images 818→40 KiB（d5de41c）、unused-css-rules 45→19 KiB（e6ad4de）
- 側枝 2fb33dc で server-response-time / document-latency-insight（ともに score 0）が解消し、observed FCP 3,327ms → 99ms（-97%）

1. Lighthouse 100点でも 1.4MB 以上の無駄が残っていた（8207ec1 で 1.4MB 削っても指標は1ポイントも動かない）
2. defer 済みのページでは script の body末尾移動は FCP に逆効果（55→62ms、9回計測で再現性あり）。第1段階の目的は FCPフェーズ 3686c1c の defer化で達成済みだった
3. async 付与は完全に効果ゼロ。外部30スクリプトの静的解析で、外部グローバルを参照しないのは lazysizes のみと判明
4. template 要素への退避では転送量は減らない（実測 +2,545B）。両案を実装比較し外部フラグメント化（-62.5%）を採用
5. IntersectionObserver はビューポート境界に接しただけで isIntersecting: true（ratio 0）を返す。intersectionRatio > 0 の併用が必須
6. WebP化より「表示サイズへの適正化」の効果がはるかに大きい（同じ12枚で -47% vs -90.5%）
7. VRT の三峰構造（約7.5% / 9.7% / 15%）は起点 e7ac9a8 から存在（無変更で15回計測して実証）
8. TTFBシミュレーション（2fb33dc）は Overall Score 100 のまま observed FCP を -97% 改善した。スコアだけ見ても最大のボトルネックは発見できないことの直接証拠
9. Lantern が HTML の TTFB を無視している。network-server-latency の www.peachjohn.co.jp は 40.17ms で、Lantern はオリジン単位の最小応答時間を推定に使うため HTML本体の 3,260ms がシミュレーションから消えている。これが「observed FCP 3,335ms なのに simulated FCP 55ms」の正体

LCP: 71ms
CLS: 0.000
TBT: 0ms
FCP: 52ms
SI: 1748ms
Overall Score: 100

転送量 2,820 KiB → 636 KiB（-77.4%）、DOM 3,777 → 1,585要素（-58%）
LCP 105ms → 71ms、FCP 55ms → 52ms、SI 1854ms → 1748ms

  • LCPを改善

    e7ac9a8f · ファーストビュー描画に関与する画像20件のWebP化 · 
    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

  • FCPを改善

    3fcb3861 · メインビジュアルの opacity:0 の解消 · 
    FCPを改善

| 項目 | 状態 |
|------|------|
| GZIP圧縮（必須） | 適用済み（4342f8e。HTML/CSS/JS の未圧縮0件） |
| パブリックCDNの同一ドメイン化 | 適用済み（541d2f8: ajax.googleapis.com 3件） |
| CSSが別ドメインから配信 | 適用済み（18d85f9: Google Fonts CSS / 541d2f8: jquery-ui.min.css） |
| 複数CSSの一本化（4個以上） | 適用済み（c2661fa: レンダーブロッキング9→2件 / f8b7d6a: スタイルシート22→3件） |
| script要素によるレンダリングブロック | 適用済み（3686c1c: パーサーブロッキング4件→0件） |
| 不使用CSSの存在 | 適用済み（cae0789: jquery-ui.min.css 36KB除去 + purgecss で計約140KB削減） |
| アニメーションによる表示遅延 | 適用済み（3fcb386: #top-slider-wrap の opacity:0 解消） |
| クリティカルCSSの逆効果 | 検証済み・不採用（cdd6930: 逆効果ではなく必須の防波堤と判明） |
| CSSの@import使用 | 該当なし（grep でヒット0件） |
| document.write | 該当なし（grep でヒット0件） |
| Google Optimizeによる表示制御 | 該当なし（async-hide / GTM- / dataLayer / optimize.js すべて0件） |
| preloadの誤用 | 該当なし（preload/prefetch/modulepreload 0件。preconnect 2件は正用法で uses-rel-preconnect score 1） |

| コミット | プラクティス | FCP | 採否 |
|---|---|---|---|
| 4342f8e | GZIP圧縮の適用 | 530ms | 採用 |
| 18d85f9 | Google Fonts CSS の同一ドメイン化 | 113ms | 採用 |
| 541d2f8 | パブリックCDN（ajax.googleapis.com）の同一ドメイン化 | 83ms | 採用 |
| cae0789 | 未使用CSSの除去 | 81ms | 採用 |
| c2661fa | レンダーブロッキングCSSの一本化 | 86ms | 採用 |
| 3686c1c | パーサーブロッキングscriptの解消 | 62ms | 採用 |
| f8b7d6a | 遅延CSS21件の一本化 | 56.5ms | 採用 |
| cdd6930 | 遅延CSSのレンダーブロッキング化 | 61.0ms | 不採用（側枝。CLS 0.434 / Overall 81） |
| 3fcb386 | メインビジュアルの opacity:0 の解消 | 56.0ms | 採用 |

採用8件、不採用1件。不採用の cdd6930 は側枝として記録し、後続には引き継いでいない。

1. Google Fonts CSS の同一ドメイン化が最大の効果（18d85f9）: FCP 530→113ms。render-blocking-resources 監査が score 1・items 0件に
2. パブリックCDN の同一ドメイン化（541d2f8）: ページ由来の外部ホストが fonts.gstatic.com（woff2）のみに
3. パーサーブロッキングscript の解消（3686c1c）: FCP 86→62ms（-28%）
4. CSS の一本化: レンダーブロッキング 9→2件、スタイルシートのリクエスト 22→3件、総リクエスト 111→92
5. メインビジュアルの opacity:0 の解消（3fcb386）: LCP要素が Cookie同意文 → 本来のヒーロー画像に是正。prioritize-lcp-image 監査も score 1 に
6. observed FCP 3,740→3,328ms（-412ms）

- HTMLのTTFB 3,255ms（server-response-time score 0、metricSavings.FCP 3150）が数値上最大のボトルネックだが、サーバ改修領域のため本フェーズでは未対応
- Google Fonts 自体の廃止（fonts.gstatic.com の woff2 34.7KB）は補足施策フェーズの対象

LCP: 155ms
CLS: 0.000
TBT: 0ms
FCP: 57ms（複数回計測の中央値 56.0ms）
SI: 1858ms
Overall Score: 100

FCP 532ms → 57ms（-89%）、LCP 734ms → 155ms、SI 2369ms → 1858ms
全5指標のスコアが100点に到達

  • TBTを改善

    51be0f05 · window.load 内の連続処理の分割（効果なし） · 
    TBTを改善

| 項目 | 状態 |
|------|------|
| ロングタスク（50ms以上の処理） | 適用済み（2879b5a / 9745955。long-tasks 検出 1件 → 0件） |
| 同期XHR（XMLHttpRequest） | 適用済み（2879b5a: top_sb.js の jQuery.ajax async:false → true。TBT 40ms の全量がこれに由来） |
| jQueryの.each()による大量のDOM操作 | 適用済み（9745955: lazybeforeunveil の .tile() をデバウンス） |
| 遅延読み込みライブラリ自体の負荷 | 一部適用済み（aeeeff1 / 9745955）。lazysizes の重複除去は Diff 12.3206% で解決困難のため現状維持 |
| スライダー（Swiper等）の複数初期化 | 適用済み・効果なし（51be0f0: 実測でロングタスク閾値未満のため指標に算入されず） |
| DOMContentLoadedハンドラ内の重い処理 | 該当なし（第一者ハンドラ1件のみ、MutationObserver 登録のみ。トレース実測 8回 計0.1ms） |
| jQueryの.load()による同期通信 | 該当なし（7箇所を調査。ページロード時実行の2箇所はレスポンス実体に script 要素0件のため同期化しない） |

| コミット | プラクティス | TBT | Score |
|---|---|---|---|
| 2879b5a | 同期XHR（トレンドキーワード取得）の非同期化 | 0ms | 100 |
| aeeeff1 | 重複読み込みスクリプトの除去（3件） | 0ms | 100 |
| a39b7d0 | 未使用 vue.min.js の除去 | 0ms | 100 |
| 9745955 | lazybeforeunveil ハンドラのデバウンスによるレイアウトスラッシングの解消 | 0ms | 100 |
| 51be0f0 | window.load 内の連続処理の分割（効果なし） | 0ms | 100 |

全5プラクティス採用、不採用0件。フォーカス指標 TBT が悪化したプラクティスは0件。

1. TBT 40ms の全量が単一の同期AJAX（top_sb~250821.js:149 の async: false）に由来することを trace 解析で特定し、1行の変更で 0ms を達成
2. .tile() のレイアウトスラッシング解消（9745955）: lazybeforeunveil の EventDispatch 153.5ms → 28.8ms、Layout 504回115.5ms → 156回62.0ms、UpdateLayoutTree 512回59.6ms → 163回39.3ms、Style & Layout 174.1ms → 100.7ms、lazysizes の bootup-time 204.1ms → 116.6ms。Lighthouse 指標には現れない（TTI以降のため）が実機の体感に影響する明確な弱点
3. unused-javascript 179 KiB → 90 KiB（重複 swiper -43KiB、未使用 vue -46KiB）

LCP: 734ms
CLS: 0.000
TBT: 0ms
FCP: 532ms
SI: 2369ms
Overall Score: 100

TBT 40ms → 0ms、long-tasks 1件 → 0件

  • CLSを改善

    04df4820 · スライダーラッパー余白のレンダーブロッキングCSSへの前倒し · 
    CLSを改善

| 項目 | 状態 |
|------|------|
| 画像のwidth/height属性 | 適用済み（1022c82 直読み込み16件、b2f9472 遅延読込462件。unsized-images 432要素→0要素） |
| 動的に挿入されるコンテンツ | 一部適用済み（f06abac: #block-header-bnr の高さ事前確保）。残り6箇所は layout-shifts 監査でシフト未検出のため対処不要 |
| ヘッダー/フッターの動的な高さ変化 | 適用済み（13f3a68: .wrapper の padding-top 73px を CSS で事前確保） |
| カルーセル/スライダーのCSS最適化（必須） | 適用済み。メインビジュアル=1022c82、ランキングタブ=1873ddc（効果なし・実測0.000）、特集ブロック=実測0.029だが対処見送り（Diff 9.1662% が上限直近、ベースライン不変ルールにより回避不可）、bxslider=未使用 |
| 遅延読込CSSによるレイアウト後付け | 適用済み（04df482: #top-slider-wrap の margin/overflow をレンダーブロッキングCSSへ前倒し） |
| Webフォント | 該当なし（@font-face 9件はコメントアウト済み。Google Fonts は css2 正規版・display=swap・preconnect 済みで font-display 監査 score 1） |
| JSによるzoom変更 | 該当なし（第一者JSにヒット0件。Swiper内蔵ズームと旧IE向け zoom:1 ハックのみ） |

| コミット | プラクティス | CLS | Score |
|---|---|---|---|
| 1022c82 | 直読み込み画像への width/height 属性付与（16件） | 0.229 | 88 |
| b2f9472 | 遅延読込画像への width/height + aspect-ratio 付与（462件） | 0.174 | 92 |
| 13f3a68 | 固定ヘッダー分の余白をCSSで事前確保（73px） | 0.075 | 99 |
| f06abac | ヘッダー下帯バナー領域の高さ事前確保 | 0.010 | 100 |
| 1873ddc | ランキングタブのJS再構成によるレイアウト変化の抑止（効果なし・実測0） | 0.010 | 100 |
| 04df482 | スライダーラッパー余白のレンダーブロッキングCSSへの前倒し | 0.000 | 100 |

全6プラクティス採用、不採用0件。フォーカス指標 CLS が悪化したプラクティスは0件。

LCP: 806ms
CLS: 0.000（実数値 0.0000605）
TBT: 40ms
FCP: 530ms
SI: 2450ms
Overall Score: 100

CLS 0.721 → 0.000（実質解消）、Overall Score 76 → 100
layout-shifts 監査・unsized-images 監査ともに score 1.0

  • サードパーティタグを除去

    1ea08d3e · 残存サードパーティタグを一括除去 · 
    サードパーティタグを除去

| 項目 | 状態 |
|------|------|
| Visumo（Instagram UGCウィジェット） | 適用済み（c28af1d） |
| StaffStart（スタッフスタート） | 適用済み（2ebc1a6） |
| ReviCo（レビューSaaS） | 適用済み（b76a295） |
| Google Tag Manager / GA4 | 適用済み（61ad727） |
| Repro Booster（画像プロキシ/SW） | 適用済み（61ad727。元画像28件を実取得して復元） |
| Meta Pixel / TikTok Pixel / Criteo / The Trade Desk / DoubleClick | 適用済み（61ad727。GTM配下として連鎖除去） |
| ScaleOut / Intimate Merger / awoo / LINE Tag / ca-link / 広告Cookieシンク20ドメイン | 適用済み（61ad727。GTM配下として連鎖除去） |
| A8.net / ValueCommerce / WorldShopping | 適用済み（1ea08d3） |
| Rtoaster / Adobe Analytics / User Insight / YJTag | 適用済み（1ea08d3） |
| チャットウィジェット | 該当なし（Zendesk/Intercom/Karte等をgrep検索、ヒット0件） |
| SNS埋め込みSDK | 該当なし（フッターは単なる a リンクのみ） |
| Public CDN（jQuery 3.5.1 / jQuery UI 1.13.1） | 除去対象外のため保持（後続フェーズで対処） |
| Google Fonts（fonts.googleapis.com / fonts.gstatic.com） | 除去対象外のため保持（後続フェーズで対処） |

- 残存サードパーティドメイン: 0件（3rdparty-evaluator が独立検証）
- playback 実測リクエストドメイン: www.peachjohn.co.jp / ajax.googleapis.com / fonts.googleapis.com / fonts.gstatic.com の4ドメインのみ
- 画像の404: 0件。復元28件はすべて JPEG/PNG（AVIF流用なし）
- リソース数: 493 → 175、転送量 16.39MB → 8.99MB

LCP: 780ms
CLS: 0.721
TBT: 41ms
FCP: 531ms
SI: 2479ms
Overall Score: 76

LCP -6891ms, CLS +0.039, TBT -29ms, FCP -794ms, SI -9850ms, Score +33

  • オリジナルデータ

    98e774ad · オリジナルデータを記録 · 
    オリジナルデータ

https://www.peachjohn.co.jp/shop/ のオリジナルデータをinventoryに記録した。
493リソース、合計約15MB。

LCP: 7671ms
CLS: 0.682
TBT: 70ms
FCP: 1325ms
SI: 12329ms
Overall Score: 43