DevTools 的新功能 (Microsoft Edge 100)

這些是 Microsoft Edge 穩定版本中的最新開發工具功能。

影片：Microsoft Edge |DevTools 100 的新功能

在 GitHub 加入 Microsoft Edge DevTools 社群

我們很高興在 GitHub 上宣佈新的 MicrosoftEdge > DevTools 存放庫！ 這個新的存放庫是我們的開發人員社群向我們傳送想法、意見反應、建議和秘訣以改善 DevTools 的地方。 我們很樂於與您討論 DevTools 如何更符合您的需求，並因應您每天在建立絕佳 Web 體驗時所面臨的挑戰。

前往 GitHub 上的 DevTools 存放庫，成為 Edge DevTools 社群的一員。

依節點類型篩選堆積快照集摘要

在 [記憶體 ] 工具中查看堆積快照中的所有物件時，可能很難專注於特定物件或保留路徑。 現在在 Microsoft Edge 100 中，您可以在查看堆積快照集時使用新的 節點類型 篩選，只專注於特定類型的節點。 例如，若要只查看堆積中的陣列和字串物件，請在 [節點類型] 篩選器中選取 [陣列] 和 [字串] 項目：

另請參閱:

• 使用記憶體工具記錄堆積快照集 (「堆積快照集」分析類型) - 取得堆積快照集並分析堆積。

使用捷克文和越南文的 DevTools

自訂和簡化開發人員體驗包括讓每個人都能使用我們的工具，無論他們的偏好語言為何。 我們已新增兩種新的語言：捷克文和越南文，到支援的語言清單中，並將持續新增更多語言。 如果開發工具不支援您的慣用語言，請告訴我們！

另請參閱:

• 變更開發工具語言設定

[網路] 工具現在會顯示要求的完成方式

在 Microsoft Edge 版本 100 中， 網路 工具支援要求記錄檔中新的 [ 履行者] 欄。 如果要求是由服務工作者或從快取完成，則現在會在 [ 履行者] 欄中追蹤該資訊。 將要求記錄 HAR 匯出或匯入為檔案時，也會包括 [ 履行者 ] 欄中的資訊。

另請參閱:

• 在 [網路功能參考] 中依屬性篩選要求。

如需此功能的歷程記錄，請參閱 問題 #16。

依嚴重性和瀏覽器目標篩選 [問題] 工具中的郵件

在 [問題] 工具中，新的 [嚴重性] 和 [瀏覽器 ] 下拉式清單可讓您依嚴重性和瀏覽器目標篩選訊息，以協助您專注於最相關的意見反應。 您可以選取或清除每個下拉式清單中的選項。

若要查看所有相關訊息，您可能需要重新整理頁面。 如果出現提示，請在 [問題 ] 工具中，按一下 [重新產生問題 ] 按鈕。

根據預設， [嚴重性 ] 篩選設定為只顯示警告和錯誤：

瀏覽器篩選僅適用於瀏覽器相容性意見反應，如 [問題] 清單的 [相容性] 區段所示。 根據預設， 瀏覽器 篩選會顯示排名靠前的瀏覽器訊息，如 Browserslist 所定義：

在下列範例中，會篩選掉有關 Firefox 和 Android 版 Firefox 的訊息：

另請參閱:

• 使用 [問題] 工具在 [尋找問題] 中篩選問題並修正問題。

匯入成效設定檔時，連結現在會對應至您的原始程式碼

記錄效能設定檔時， [效能 ] 工具中的火焰圖會顯示主執行緒上每個事件至 [來源] 工具中對應 JavaScript 函數的連結。 不過，當您匯出和匯入效能設定檔時，這些連結會中斷。

在 Microsoft Edge 100 中，來自匯入效能設定檔的連結現在會使用來自 Azure Artifacts 符號伺服器的原始程式碼對應回您熟悉的原始原始程式碼。 效能設定檔必須已匯出在 Microsoft Edge 100 (或更新版本) 中，才能讓設定檔包含解析匯出效能追蹤中來源對應所需的資訊。

另請參閱:

• 將處理後的程式碼對應至原始原始程式碼，以進行偵錯
• 藉由將原始檔對應發佈到 Azure Artifacts 符號伺服器，安全地偵錯原始程式碼
• 使用 Azure Artifacts 符號伺服器來源對應安全地偵錯原始程式碼

修正：網路工具中的瀑布視圖現在與 Visual Studio Code 主題匹配

更新：從 Microsoft Edge 131 開始，Visual Studio Code 佈景主題功能遭到移除，而這類佈景主題會還原為預設佈景主題：

• 輕量+
• Dark+

在舊版的 Microsoft Edge 中，網路工具中要求的瀑布式檢視不符合 Visual Studio Code 中適用於其餘開發工具的主題。 在 Microsoft Edge 版本 100 中，這個問題已經修正。

在 Microsoft Edge 版本 100 之前，瀑布視圖中未套用選取的佈景主題：

現在在 Microsoft Edge 100 中，選取的佈景主題會套用至 [網路] 工具中要求的瀑布檢視：

另請參閱:

• 在 [網路功能參考] 中顯示請求的計時關係 - [網路] 工具中請求的瀑布視圖。

來自 Chromium 專案的公告

Microsoft Edge 版本 100 也包含來自 Chromium 專案的下列更新：

• View and edit @supports at rules in the Styles pane
• 暫留時預覽類別/函數屬性
• [效能] 面板中部分呈現的框架

另請參閱

• Microsoft Edge DevTools 的新增功能
• Microsoft Edge Web 平台的版本資訊