本文へスキップ
MameTechNews
フロントエンド

Chrome DevTools 152、SPAのソフトナビでもCWVをLive Metrics表示

## POINTS

  • ソフトナビゲーション単位でCWVを追えるため、SPAのルーティング性能を初回ロードと分けて評価できる
  • Networkの再送とプリロード列で、投機的読み込みの当たり外れを手元で再現しやすくなった
  • DevTools MCPのヒープ検査強化により、エージェント経由のメモリ調査が現実的な選択肢になる

Chrome for Developersは、Chrome 152向けDevTools更新を発表した。PerformanceパネルのLive Metricsが、シングルページアプリのクライアント側ソフトナビゲーションでもCore Web Vitals(LCPやINPなど)を既定で取得・表示するようになった。web-vitals v6.0.0への更新が基盤だ。

Networkではfetch/XHRの再送(Resend)、プリロード判定列、バイナリPayloadのBase64/Hex/UTF-8デコードが追加された。Elementsではカスタム要素のadorner、入れ子CSSの親セレクタ操作、擬似要素の$0バインドが強化されている。Consoleではconsole.table()結果をMarkdown/CSVでコピーできる。

さらにDevTools MCPサーバーv1.7.0では、ヒープスナップショットのオブジェクト詳細取得やネイティブV8コンテキスト絞り込みなど、Antigravity/Claude/Codexといったコーディングエージェント向けのメモリデバッグが拡充された。

実務への影響

  • SPAの体感性能を「初回ロードだけ」で測る運用は陳腐化し、ソフトナビ単位のCWV監視が標準になる
  • エージェントにDevToolsを握らせる前提なら、ヒープ経路の説明可能性がデバッグ手順に入る
  • 再送とプリロード可視化は、推測ローディング設計の検証コストを下げる