DevTools の新機能 (Microsoft Edge 115)

これらは、Microsoft Edge の Stable リリースの最新の DevTools 機能です。

DevTools を Azure 成果物シンボル サーバーに接続するための機能強化

Microsoft Edge 115 では、DevTools を Azure Artifacts シンボル サーバーに接続する方が簡単でカスタマイズ可能になりました。 以前のバージョンの Microsoft Edge では、シンボル サーバーに対して認証するには、Azure DevOps で個人用アクセス トークン (PAT) を生成し、それらを DevTools に貼り付ける必要がありました。 これで、職場アカウントを使用して Microsoft Edge にログインしている限り、Microsoft Entra ID を使用してシンボル サーバーに接続できます。

さらに、異なる Azure DevOps 組織からソースマップをフェッチする必要がある場合に備えて、複数のシンボル サーバーに接続できるようになりました。 また、ソースマップ URL を包含リストまたは除外リストに指定することで、DevTools がシンボル サーバーからフェッチするソースマップをフィルター処理することもできます。

DevTools 設定から Microsoft Entra ID を使用してシンボル サーバーに接続する

「An Azure DevOps organization must be selected」というメッセージは、organizationをダブルクリックするか、クリックして Enter キーを押すことを意味します。

ワイルドカード

[ フィルター動作 ] テキスト ボックスでは、次のワイルドカードがサポートされます。

ワイルドカード 意味
? 1 文字に一致します。
* 任意の文字の 1 つ以上に一致します。

[ 除外リスト] を選択した場合、DevTools は、リスト内のエントリのいずれかに一致する URL を持つスクリプトを除くスクリプトのソース マップの検索を試みます。

[ 包含リスト] を選択した場合、DevTools は、リスト内のエントリのいずれかに一致する URL を持つスクリプトのソース マップのみを検索します。 たとえば、[フィルター動作] ドロップダウン リストで [包含リスト] を選択し、[フィルター動作] テキスト ボックスに次のように入力するとします:

https://cdn.contoso.com/*
https://packages.contoso.com/*

この例では、DevTools はこれら 2 つの URL パターンに一致するソース マップの解決のみを試み、他のスクリプトのソース マップの読み込みは試行しません。

関連項目:

メモリ ツールの機能強化

以前のバージョンの Microsoft Edge のメモリ ツールで、[タイムラインでの割り当てインストルメンテーション] プロファイリングの種類 (後に [タイムラインでの割り当て] オプション ボタンとして再ラベル付け) を使用すると、メモリ ツールは 50 ミリ秒ごとにヒープのサンプルを取得します。 ただし、ヒープのサンプルを取得することはヒープのサイズに応じて変化するため、ヒープ サイズが 200 MB の場合、サンプルの生成には実際には 1.5 秒かかります。 その結果、ヒープ サンプルの生成以外に、Web サイトのメイン スレッドに残される時間はほとんどありません。 タイムラインでのアロケーション インストルメンテーションが実行されている場合、Web コンテンツがハングまたはブロックされているように見える場合があります。

Microsoft Edge 115 では、ヒープのサンプル レートがサンプルの生成にかかる時間に合わせて拡張され、メイン スレッドが解放されてプロファイリング中に Web コンテンツを操作できるようになります。

メモリ ツールの [タイムラインでの割り当てインストルメント化] プロファイリング オプション

さらに、以前のバージョンの Microsoft Edge では、ヒープ スナップショットにガベージ コレクション (GC'd) されたはずのオブジェクトが含まれる場合があります。 Microsoft Edge 115 では、この問題が修正され、ヒープ スナップショットの精度が向上しました。

関連項目:

更新された DevTools アイコンとボタン

Microsoft Edge 115 では、DevTools UI が新しいアイコンとボタンでイメージを変えられました。 たとえば、[ ソース] ツールでデバッグする場合、呼び出し履歴内の現在のフレームは右向きの青い矢印で示されます。 このアイコンは、Microsoft Visual Studio および Microsoft Visual Studio Code のデバッグ アイコンとのより一貫性があります。

呼び出し履歴内の現在のフレームの右向きの青い矢印アイコン

以前のバージョンの Microsoft Edge では、パフォーマンス ツールのボトムアップ ビューで、記録されたアクティビティを折りたたんだり展開したりするための三角形ボタンが正しくレンダリングされませんでした。 Microsoft Edge 115 では、この問題が修正され、個々のアクティビティを展開および折りたたんで、どの関数がそれらを呼び出しているかを確認できます。

ボトムアップ ビューでアクティビティを展開および折りたたむための三角形アイコン

関連項目:

スクリーン リーダーがデバイス モードでドロップダウンの状態を正しくアナウンスする

以前のバージョンの Microsoft Edge のデバイス モードでは、ドロップダウン メニューが実際に折りたたまれているときに、スクリーン リーダーがドロップダウン メニューの状態を誤って "展開済み" としてアナウンスしていました。 Microsoft Edge 115 では、この問題が修正され、スクリーン リーダーはデバイス モードのドロップダウン メニューの状態を "折りたたまれた" または "展開された" として正しく通知するようになりました。

デバイス モードで展開された [調整] ドロップダウン メニュー

関連項目:

パフォーマンス ツールのプロファイリングの機能強化

パフォーマンス ツールでプロファイルを記録する際、V8 JavaScript エンジンは、実行中のすべての JavaScript 関数の定期的なサンプルを取得して、フレーム チャートの CPU 時間を正確に報告します。 クロスドメイン iframe が多い Web サイトをプロファイリングする場合、これらのサンプルの収集には長い時間がかかります。 その結果、かなりのオーバーヘッドが発生し、メイン スレッドの速度が低下し、プロファイリング中の Web サイトのパフォーマンスが低下します。 Windows 上の Microsoft Edge 115 では、V8 によってこれらのサンプルがより効率的に収集されるため、プロファイリング時のサイト パフォーマンスが向上します。

さらに、 パフォーマンス ツールで、プロファイルを記録するときにフレーム チャートにプロファイラーのオーバーヘッドの表現を表示できるようになりました。 この時間ブロックは、プロファイルを記録するときにイベントのサンプリングと解析に必要な CPU 時間を表しており、Web サイトのユーザーが実際に遭遇している CPU 時間を表すものではありません。 プロファイリング オーバーヘッド イベントがフレーム チャートに追加され、パフォーマンス ツールでのプロファイリング中にのみ時間がかかるイベントではなく、実際のユーザーに影響を与えるコードのコンパイル イベントとスクリプトの評価イベントにパフォーマンス調査を集中させやすくなりました。

記録されたパフォーマンス プロファイルの時間の

関連項目:

Chromium プロジェクトからのお知らせ

Microsoft Edge 115 には、Chromium プロジェクトからの次の更新プログラムも含まれています。

関連項目