瞭解開發人員工具如何透過全新的裝置模式，讓行動裝置優先，並且一律啟用。使用顏色按鈕快速為選取器新增顏色，並瞭解即將在 DevTools 中推出的功能。
一窺未來的撰寫作業
我們剛從 Chrome 開發人員大會回來，我在那裡向您展示了目前和未來的開發人員工具。我通常不會在這個摘要中提及任何仍處於實驗階段或開發中的功能，但這次例外。如果沒有時間觀看完整內容，請參考以下重點摘要：
裝置模式第 2 版
我們仍在積極開發這項全新的 Device Mode，但希望讓所有人都能試用，因此今天已在 Canary 中啟用這項功能。隨著這些異動，我們將 DevTools 推向行動版內容優先的未來，其中行動版開發作業為預設，電腦版開發作業則是「附加元件」。請期待接下來幾週的更多迭代，並在完成後發布更詳細的部落格文章。
強大的動畫檢查功能
動畫檢查功能可讓您深入瞭解動畫中的所有元素，我們新增了一些啟發式規則，將複雜的動畫分組，讓您一次只看到一個元素的轉場效果，方便您專注於當下畫面。請觀看影片。我們會在服務全面推出後，發布更完整的獨立網誌文章。
版面配置模式 (搶先預覽)
雖然尚未正式推出，但新版版面配置模式非常有潛力，我迫不及待看到這項功能的完整版。版面配置模式會為網頁上的任何元素，在開發人員工具中新增 WYSIWYG 編輯功能。目前，高度、寬度、邊距和邊界都可以在內容中編輯。我們還需要一點時間才能讓你試用，但我們會隨時通知你最新消息。
使用更新版「時間軸」面板進行效能分析
為了推出新的 RAIL 效能模型，我們對時間軸面板進行了數百項大小不一的變更，這些變更共同改變並改善了效能分析的情況。因此，我們不只會單獨顯示每項變更，我們的同事 Paul Irish 也會在現場演示如何正確偵錯網站效能，以本例來說就是 Hotel Tonight 的行動版網站。新推出的功能包括載入和效能影格、內含聯播網瀑布圖、樹狀圖摘要，以及依網域和檔案查看效能成本。
輕鬆為任何元素加入前景和背景顏色
如要為元素新增背景顏色或顏色屬性，您無法只開啟色彩挑選器。相反地，大多數使用者每次都會輸入類似「background: red;」的內容，讓顏色挑選器圖示顯示，然後選擇所需的實際顏色。
我們認為可以簡化這項功能。我們新增了兩個實用的按鈕，當滑鼠游標懸停在選取器的右下角時就會顯示，讓您只要按一下滑鼠就能新增顏色並開啟色彩挑選器：
其他最佳
- 我們先前在「Style」面板中顯示一般媒體類型，浪費了許多空間。我們現在會在選取器前隱藏這些內容 (如果不是異常情況的話)！
- 您現在可以將滑鼠懸停在樣式面板中的 CSS 選取器上，查看該選取器適用於網頁上的元素數量。
- 還沒放棄列印嗎？列印媒體模擬功能仍可用來查看網頁在列印時的樣貌，我們只是將該功能移至「算繪設定」頁面。
- 選擇要檢查的元素時，我們現在會自動展開及關閉相關的 DOM 子樹。很難解釋，眼見為憑。
如往，歡迎透過 Twitter 與我們分享您的想法或在下方留言，並將錯誤提交至 crbug.com/new。
下個月見！
Paul Bakaus 和開發人員工具團隊