這些是 Microsoft Edge DevTools 穩定版的最新功能。
提示
Microsoft Build 2022 大會於 5 月 24 日至 26 日舉行。 在以下影片中，了解更多關於 DevTools 中記憶體、效能與生產除錯的新功能，以及 PWA 網頁平台的新功能：
影片：Microsoft Edge |DevTools 102 的最新動態
DevTools 擴充功能：新瀏覽器，具備裝置與模式模擬及原始碼地圖支援
Microsoft Edge DevTools 擴充套件（Visual Studio Code）現在有瀏覽器預覽功能，可以模擬不同裝置。 點擊新的 Emulate CSS 媒體功能 (
) 按鈕，預覽目前專案在不同模式，如暗、亮、列印和高對比度：
點擊新的 Emulate 視覺障礙 (
) 按鈕，輕鬆測試無障礙功能，例如顯示視力模糊或色覺缺陷時網頁的樣貌。
其他新功能包括更簡單的 CSS 鏡像切換方式，現在也支援原始碼映射。 這表示你可以在瀏覽器中即時除錯和修改由 Sass、React 及其他抽象化所建立的 CSS，並看到原始檔案中的變更。
另請參閱:
將堆積快照中的所有字串儲存為 JSON
在 Microsoft Edge 102 中，當你在 記憶體 工具中擷取堆積快照時，現在可以將快照中的所有字串物件匯出成 JSON 檔案。 在記憶體工具的建構者區塊，點擊條目旁(string)的新「全部儲存到檔案」按鈕。
記憶體工具會匯出一個包含堆積快照中所有字串物件的 JSON 檔案：
另請參閱:
- 使用記憶體工具 (「堆疊快照」剖析類型) ，將堆積快照從堆積快照儲存並匯出為 JSON 檔。
記憶體工具中保留器的新增過濾器
在先前版本的 Microsoft Edge 中，週期與內部節點會顯示在堆積快照的 Retainers 區塊中。 為了簡化保留器路徑，在 Microsoft Edge 102 中，記憶體工具中的保留器區塊新增了新的篩選器，可以隱藏循環及保留路徑中的內部節點。
在 Retainers 章節中，循環節點會以灰色顯示。
在下圖中，在 篩選邊緣下 拉選單中，未選擇 「隱藏循環」 ，因此循環節點 (顯示為灰色) ：
在下圖中，篩選 邊緣 下拉選單中選擇了 「隱藏循環」 ，因此循環節點不會顯示：
週期 是保持路徑中至少出現兩次的節點。 節點的出現在保持者路徑的較早位置，而該節點的其他出現則在保持者路徑的較晚處。 為了釋放記憶體，最重要的是移除保持器路徑中最先出現的節點。 該節點的第二次及可能的後續出現仍顯示在 Rematers 區塊。
內部節點 是 Edge) 中 JavaScript 引擎 (V8 專屬的物件Microsoft。 內部節點也會顯示在 Retainers 區塊中。
另請參閱:
- 使用記憶體工具 (「堆疊快照」剖析類型) 隱藏記錄堆快照中的週期。
檢查元素工具提示現在可以持續存在，直到你關閉它為止
之前在 元素 工具中，選取節點的覆蓋層只有在使用 檢查工具 時 (檢查 
) 時才會顯示。 先前的設計難以搭配螢幕放大鏡或其他輔助技術使用。
在 Microsoft Edge 102 中，使用 Inspect 工具並在渲染網頁中移動時，可以保留目前的 Inspect 覆蓋層。 在渲染網頁中移動時，按住 Windows、Linux) (Ctrl+Alt ，或 macOS) (Ctrl+Option 。 檢視 工具現有 的提示與格子顏色覆蓋層會持續顯示，當你將滑鼠移到渲染網頁的不同部分時：
此外，你現在可以按 Ctrl 來隱藏檢查工具的覆蓋層，同時移動滑鼠指標在渲染後的網頁上。
關於Chromium開源專案中此功能的歷史，請參見第1316208期。
另請參閱:
- 使用 Inspect 工具在分析頁面中持續保留 Inspect 工具的提示與格子顏色覆蓋層。
- 在 Navigate DevTools with assistive Technology中，持續保留檢查工具的提示與格線顏色覆蓋層。
高對比模式下下拉選單、按鈕和圖示的渲染效果提升
在先前版本的 Microsoft Edge 中，以下項目在高對比模式下無法正確呈現：
- 議題 工具中的 下拉選單。
- 分離 元素 工具中的按鈕。
- 活動欄進入對焦模式。
在 Microsoft Edge 102 中，這些問題已被修正。
問題工具的選單在高對比模式下顯示正確：
分離元素工具的介面在高對比模式下顯示正確：
活動 列 與 快速檢視 面板在使用對焦模式時 () 在高對比模式下會正確顯示：
另請參閱:
從設定中了解 DevTools 中的實驗
在 設定>實驗頁面中 ，每個實驗現在都有 一個幫助 (
) 按鈕：
欲了解更多關於實驗性功能的資訊，請點擊對應的 幫助 () 按鈕。
說明按鈕顯示了 Microsoft Edge DevTools 實驗性功能文章中相關章節。
窄窄時網路設定的配置更佳
在先前版本的 Microsoft Edge 中，使用網路工具中齒輪圖示開啟網路設定時，開發工具的範圍會與之重疊：
在 Microsoft Edge 102 中，這個問題已經修正。 現在，個別設定在狹窄版面中顯示得更佳：
另請參閱:
- 在網路功能參考中擷取頁面載入時的截圖，關於網路工具可設定設定。
Chromium 計畫的公告
Microsoft Edge 102 也包含 Chromium 專案的以下更新：