Microsoft Edge中新的F12開發者工具
英文原文:New F12 Developer Tools for the New Microsoft Edge
微軟宣布 Microsoft Edge 將成為新 web 瀏覽器的正式名稱,他將取代 Internet Explorer 11 的地位。Edge 之前被稱為 Project Spartan,它將努力爭取在現代 web 的舞臺上成為一個有力的競爭力。作為新瀏覽器計劃的一部分,Edge 帶來了一個全功能的開發者工具體驗。來自微軟的 Andy Sterland 在 Build 2015 大會上介紹了 Edge 中新的 F12 開發者工具中的某些特性。
在 Sterland 的演講“Microsoft Edge[即原來所知的 Project Spartan]中 F12 的新特性”,他介紹了微軟如何計劃與設計這個新工具,讓它能夠匹配新瀏覽器的強大能力。Sterland 表示團隊將會專注于 Microsoft Edge 的開發,在 Internet Explorer 11 上的現有工具將會凍結開發狀態,不會繼續更新。
新的工具是由 TypeScript 所開發的,并且它始終保持在運行狀態,因此開發者在打開工具之后無需重新加載整個頁面以試圖重建整個檢測結構。
新的工具在以下幾個方面得到了改進:
- 源代碼的導航能力改善 —— 可跳轉至定義,支持 JavaScript 和 TypeScript
- 新工具會盡量保證在 Edge 中所使用的常見快捷鍵與 Chrome 相同,讓開發者在開發應用時能夠更容易地學習新的瀏覽器并隨意切換。
- 控制臺的改進
- 指出某個日志消息來自于源代碼中的哪一部分
- 使用 Esc 鍵打開控制臺
- 消息中的鏈接能夠點擊(例如在源代碼或調試器中顯示的 URL) </ol> </li>
- DOM 瀏覽器的集成
- 元素高亮
- 從時間線中檢閱某個元素 </ol> </li> </ol>
在之前版本的工具中出現的腳本分析器與 UI 可響應性工具將由一個新的聯合分析器(Combined Profiler)所取代。新的分析器中添加了一個具有時間線(HTML / CSS)的 JavaScript 調用棧功能。此外還添加了一個用于 CPU 采樣的新分析器。這個分析器會在一定的間隔時間內收集 CPU 的數據,而不是捕獲每次調用,因此它的資源占用很低。
新的內存工具能夠對產生泄露的節點進行高亮,并且能夠結合 DOM 瀏覽器對 DOM 進行高亮。為了簡化這一操作,Edge 加入了一個新的控制臺方法,能夠在開發者指定的時間獲取一份內存數據的快照,這樣就無需在運行應用時手動地捕獲內存快照了。
除了這些新的特性之外,Edge 團隊仍然在繼續著他們的工作,以備將來進一步擴展這一工具的能力。Sterland 暗示,團隊正在考慮加入以下一些實驗性的特性,等這些特性完成開發之后,將通過一個額外的實驗性標簽展現這些功能: