DevTools の新機能 (Microsoft Edge 100)

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

ビデオ: Microsoft Edge |DevTools 100 の新機能

ビデオ「Microsoft Edge |DevTools 100 の新機能

GitHub の Microsoft Edge DevTools コミュニティに参加する

GitHub で新しい MicrosoftEdge > DevTools リポジトリを発表できることを嬉しく思います。 この新しいリポジトリは、開発者のコミュニティが DevTools を改善するためのアイデア、フィードバック、提案、ヒントを送信する場所です。 DevTools がどのようにお客様のニーズにより適切に対応し、優れた Web エクスペリエンスを構築する上で日々直面する課題に対処できるかについて、お客様とお話しできることを楽しみにしています。

DevTools フィードバック リポジトリ

GitHub の DevTools リポジトリにアクセスして、Edge DevTools コミュニティの一員になりましょう。

ノード タイプ別にヒープ スナップショットの概要をフィルター処理する

メモリ ツールでヒープ スナップショット内のすべてのオブジェクトを見るときに、特定のオブジェクトや保持パスに焦点を合わせるのが難しい場合があります。 Microsoft Edge 100 では、ヒープ スナップショットを確認するときに新しいノードの種類フィルターを使用して、特定の種類のノードのみに注目できるようになりました。 たとえば、ヒープ内の配列と文字列オブジェクトのみを表示するには、[ノードの種類] フィルターで [配列] と [文字列] エントリを選択します。

メモリ ツールのヒープ スナップショット内のノードの種類

関連項目:

チェコ語とベトナム語で DevTools を使用する

開発者エクスペリエンスのカスタマイズと簡素化には、優先言語に関係なく、すべてのユーザーがツールを利用できるようにすることが含まれます。 サポートされている言語のリストにチェコ語とベトナム語の 2 つの新しい言語が追加されました。今後も追加される予定です。 DevTools で希望する言語がサポートされていない場合は、お知らせください。

チェコ語とベトナム語の DevTools

関連項目:

ネットワーク ツールに要求の処理方法が表示されるようになりました

Microsoft Edge 100 では、 ネットワーク ツールは要求ログの新しい [実行元] 列をサポートしています。 要求がサービス ワーカーによって、またはキャッシュから実行された場合、その情報は [実行元 ] 列で追跡されるようになりました。 要求ログを HAR ファイルとしてエクスポートまたはインポートする場合は、[ 実行元 ] 列の情報も含まれます。

ネットワーク ツールの要求ログの [実行者] 列

関連項目:

この機能の履歴については、 問題 #16 を参照してください。

問題ツールで重大度とブラウザー ターゲットでメッセージをフィルター処理する

[問題] ツールの新しい重大度とブラウザーのドロップダウン リストを使用すると、重大度とブラウザー ターゲットでメッセージをフィルター処理して、最も関連性の高いフィードバックに集中できます。 各ドロップダウン リストのオプションを選択または解除できます。

関連するすべてのメッセージを表示するには、ページを更新する必要がある場合があります。 メッセージが表示されたら、[ 問題 ] ツールで [ 問題の再生成 ] ボタンをクリックします。

既定では、重大 度 フィルターは警告とエラーのみを表示するように設定されています。

重大度フィルター

ブラウザー フィルターは、ブラウザーの互換性に関するフィードバックにのみ適用されます。これは、[問題] リストの [互換性] セクションに表示されます。 既定では、 ブラウザー フィルターは、 Browserslist で定義されている上位のブラウザーのメッセージを表示します。

[上位のブラウザー] が選択されたブラウザーのドロップダウン リスト

以下の例では、Firefox と Android 版 Firefox に関するメッセージは除外されます。

Firefox ブラウザーに関するメッセージがフィルターで除外 (削除) されました

関連項目:

  • [問題の検索] ツールを使用して問題をフィルター処理します。

パフォーマンス プロファイルを記録すると、 パフォーマンス ツールのフレーム チャートには、メイン スレッドの各イベントから ソース ツールの対応する JavaScript 関数へのリンクが表示されます。 ただし、パフォーマンス プロファイルをエクスポートおよびインポートすると、これらのリンクは解除されます。

Microsoft Edge 100 では、インポートされたパフォーマンス プロファイルからのリンクが、Azure Artifacts シンボル サーバーからのソース マップを使用して、使い慣れた元のソース コードにマップされるようになりました。 エクスポートされたパフォーマンス トレースのソース マップを解決するために必要な情報がプロファイルに含まれるように、パフォーマンス プロファイルは Microsoft Edge 100 (以上) でエクスポートされている必要があります。

インポートされたパフォーマンス プロファイルからのリンクは、ソース マップを使用して、使い慣れた元のソース コードに移動します

関連項目:

修正: ネットワーク ツールのウォーターフォール ビューが Visual Studio Code のテーマと一致するようになりました

更新: Microsoft Edge 131 以降では、Visual Studio Code のテーマ機能は削除され、そのようなテーマは既定のテーマに戻ります。

  • Light+
  • Dark+

以前のバージョンの Microsoft Edge では、ネットワーク ツールの要求のウォーターフォール ビューが、他の DevTools に適用される Visual Studio Code のテーマと一致しませんでした。 Microsoft Edge 100 では、この問題が修正されています。

Microsoft Edge 100 より前では、選択したテーマはウォーターフォール ビューに適用されませんでした。

選択したテーマがウォーターフォール ビューに適用されませんでした

Microsoft Edge 100 では、選択したテーマがネットワーク ツールの要求のウォーターフォール ビューに適用されます。

これで、選択したテーマが、ネットワーク ツールの要求のウォーターフォール ビューに適用されます

関連項目:

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

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

関連項目