このページは Cloud Translation API によって翻訳されました。

DevTools の新機能（Chrome 126）

Sofia Emelianova

パフォーマンスパネルの改善点

このバージョンでは、[パフォーマンス] パネルを改善しました。

更新されたトラック設定モードでトラックを移動、非表示にする

トラック名を右クリックして [トラックを設定] を選択すると、トラック設定モードに入ります。追加のスペースが必要だった編集ボタンは削除されました。

トラック設定モードでは、トラックの順序を変更したり、トラックを非表示にしたりできます。arrow_upward（上）または arrow_downward（下）をクリックしてトラックを移動するか、visibility_off（非表示）をクリックします。設定モードを終了するには、下部の [Finish ConfigureTrack] をクリックします。この構成は新しいトレースでは保持されますが、次の DevTools セッションでは保持されません。

Chromium の問題: 336266699。

フレームチャートでスクリプトを無視する

メイン トラックのフレームチャートで、無視リストのサポートが追加されました。グラフ内のスクリプトを右クリックして、[無視リストにスクリプトを追加] を選択できるようになりました。

[設定] で、無視するスクリプト、無視としてマークしたスクリプト、対応するルールを追加するメニューオプション。

無視されたスクリプトが折りたたまれて [無視リスト] としてマークされ、設定の [設定] > [無視リスト] の [カスタム除外ルール] に追加されます。無視されたスクリプトは、トレースまたはカスタム除外ルールから削除するまで保存されます。

Chromium の問題: 336266714。

CPU のスロットルを 20 倍にする

[パフォーマンス] パネルの [キャプチャ設定] にある [CPU スロットリング] メニューに、新たに [20x 速度低下] オプションが追加されました。これにより、ハイエンドのパソコンでも、現実のパフォーマンスの問題をより正確に再現して分析できるようになりました。

[Capture settings] に「20x speeddonw」オプションを追加する前と後。

Chromium の問題: 324978881

パフォーマンス分析情報パネルのサポートが終了します

試験運用版の [パフォーマンス分析情報] パネルは 2024 年に廃止されます。現在、DevTools チームは便利な機能を [パフォーマンス] パネルに統合する作業を進めています。[パフォーマンス分析情報] パネルの上部に、サポート終了の予定を知らせるバナーが表示されるようになりました。

詳しくは、2024 年以降のパフォーマンスツールをご覧ください。

役に立ったこと、役に立たなかったこと、改善のご提案などがございましたら、ぜひお聞かせください。

ヘッダー文字列全体を貼り付けてオーバーライドする

ヘッダーをオーバーライドするときに、ヘッダー文字列全体（HEADER_NAME: VALUE）を貼り付けることができるようになりました。DevTools は : にある文字列をヘッダー名と値に分割します。

次の動画で実際の動作をご覧ください。

ヘッダーの編集時に、英数字、ハイフン、アンダースコア以外の文字を入力すると、[ネットワーク] パネルで警告が表示されるようになりました。

サポートされていない文字を含むヘッダー名の横に表示される警告。

また、chrome://-URL ではオーバーライドメニューオプションと [編集] ボタンが無効になっており、意図した動作と一致します。

Chromium に関する問題: 330967147、337012362、328210785

ヒープスナップショットで新しいフィルタを使用して過剰なメモリ使用量を検出する

[メモリ] パネルの [ヒープスナップショット] には、メモリが非効率的に使用される一般的なケース（重複する文字列、デタッチされた DOM ノードに保持されているオブジェクト、DevTools コンソールなど）を見つけるための新しいフィルタが追加されています。

非効率的なメモリ使用の一般的なケースに対するフィルタオプションの追加前と追加後。

Chromium の問題: 337094903。

[アプリケーション] > [ストレージ] でストレージバケットを検査する

[Application] > [Storage] セクションの専用ツリーでストレージバケットを調査できるようになりました。以前は試験運用版だったこのツリーはデフォルトで有効になっています。

[ストレージ] セクションでストレージバケットツリーを有効にする前と有効にした後

Chromium の問題: 338094915。

コマンドラインフラグを使用して自己 XSS 警告を無効にする

Chrome の使用を自動化したり、デバッグのためにコマンドラインから DevTools を開いたりする場合は、新しい DevTools セッションごとに表示される self-XSS 警告を無効にすることをおすすめします。

コンソールのセルフ xss 警告ダイアログ。

--unsafely-disable-devtools-self-xss-warnings コマンドラインフラグを Chrome に渡すと、このダイアログを無効にできます。

Chromium の問題: 41491762。

Lighthouse 12.0.0

[Lighthouse] パネルでは、Lighthouse 12.0.0 で実行されるようになりました。

この更新では、PWA カテゴリの削除、SEO カテゴリの再編成、全体的な費用削減のサポート終了、新しい監査、監査の変更など、多くの変更が加えられます。変更点の一覧をご覧ください。

DevTools の [Lighthouse] パネルの基本的な使い方については、Lighthouse: ウェブサイトの速度を最適化するをご覧ください。

Chromium の問題: 772558。

その他のハイライト

このリリースにおける注目すべき修正と改善点は次のとおりです。

パフォーマンス:
- 遅いキャプチャの設定（[高度なペイントインストルメンテーションを有効にする] と [CSS セレクタの統計情報を有効にする]）は、次回の DevTools セッションで自動的にクリアされるようになりました。
- フレームチャートをズームしてデータが変更されても、[Selector Stats] タブが自動的に下部にスクロールされなくなりました。（337999939）
コンソール: Ctrl+` ショートカットで、フォーカスされている場合にのみドロワーのコンソールを閉じるようになりました（40875466、328210785）。
自動入力: 住所解析を修正しました。（335409093、335409707）
ユーザー補助機能: ローカライズされた文字列に対するスクリーンリーダーの通知を修正しました（324930007）。

プレビューチャネルをダウンロードする

Chrome Canary、Dev、Beta を既定の開発ブラウザとして使用することをご検討ください。これらのプレビューチャンネルでは、最新の DevTools 機能にアクセスしたり、最先端のウェブプラットフォーム API をテストしたり、ユーザーが実際に体験する前にサイト上の問題を検出したりできます。

Chrome DevTools チームへのお問い合わせ

投稿内の新機能や変更点、または DevTools に関するその他のことについて話し合うには、次のオプションを使用します。

crbug.com からご提案やフィードバックをお送りください。
DevTools の問題を報告するには、DevTools でその他のオプション アイコン > [ヘルプ] > [DevTools の問題を報告する] を選択します。
@ChromeDevTools にツイートします。
「DevTools の新機能」の YouTube 動画または DevTools のヒントの YouTube 動画でコメントを残してください。