レガシーPNG資産再最適化ケーススタディ：削減率と意思決定

TL;DR

• 上位 22% の対象で全体 80% 削減バイトを回収
• 1人週 2.5人日で実行 (自動スクリプト活用)
• ROI: 3ヶ月で投下工数回収
• 再発防止: CI に索引化 & strip チェック導入

1. スキャン結果サマリ

total_files: 2840
candidates: 620 (21.8%)
avg_potential_ratio: 0.37
p95_potential_ratio: 0.48

1.5 集計クエリ例

SELECT date_trunc('week', processed_at) AS wk,
  SUM(original_bytes - optimized_bytes) AS saved_bytes
FROM png_reopt_runs
GROUP BY wk
ORDER BY wk;

2. 再最適化手順

1. png-reopt スコア上位抽出
2. 自動バッチ: 索引化 + oxipng -o max
3. 前後差分 Heatmap 確認 (劣化無/極小)
4. CDN キャッシュ無効化 & ハッシュ更新

3. 実測効果

月間 180GB → 118GB。Core Web Vitals への副作用無し。LCP 95th 変動 ±2ms。

4. 教訓

• “全部やる” は不要。上位層集中が最良
• 差分の可視化でステークホルダ合意加速
• 手元 + CI 自動チェックでリバウンド抑制

4.5 関連ツール

• PNG Re-Optimize
• Color Heatmap
• Dither Compare

5. まとめ

データドリブン選定 + 自動ツール連携で旧資産の“負債返済” を高ROIに実現。