google chrome 在日常生活中扮演的角色不隻是一個功能強大的網絡浏覽器，它内置的 devtools 同樣也是網絡開發者進行網絡開發的重要工具。
devtools 在不斷的進行版本更新，其中有很多重要的更新細節你可能會錯過。在這裡羅列了 google chrome 最值得關注的七大新特性。
開始——chrome 的 devtools experiment
chrome 有一些非常棒的實驗性特性，這些特性在預設情況下都是隐藏和禁用的。在浏覽器位址欄輸入chrome://flags/#enable-devtools-experiments可以激活 devtool experiment 選項，在激活後重新開機浏覽器。
重新開機後，啟動 devtools，點選齒輪圖示移的右上角 devtools 面闆，你可以在左邊欄看到“experiment（實驗）” 選項，在這裡你可以選擇任何一個想要激活的特性。
改進移動裝置模拟器
在移動裝置高度普及的今天，網站的一個必備功能就是進行移動裝置的優化。使用 chrome 浏覽器，你可以通過手機模拟器功能調試網站在移動模式的應用，這個模拟器已經被完全修改并增加了許多新特性。
啟動 devtools 并點選移動裝置圖示然後點選 loop/search（循環/搜尋），打開移動裝置模拟器，截圖如上所示。正如你所看到的，上面的模拟器已經配備了标尺，是以你可以清楚看到網站視窗的尺寸大小。
滑鼠的複選
你想擁有在一個源檔案裡同時選擇編輯多個不同主題的功能？chrome 現在支援滑鼠的複選。使用 ctrl + 點選或者 cmd+ 點選可以一次性選擇多個。
限制網絡連接配接
現在你可以通過 devtools 測試在不同連接配接下網站的響應和性能。在 devtools 中，點選 esc 啟動 console drawer 然後選擇 emulation。在網絡選項上，選擇限制網絡連接配接的速度類型，然後你就可以看到網站在執行標明的速度的情況下的表現了。
脫機模式
google chrome 現在增加了脫機模式，它允許你在沒有網絡連接配接的情況下打開網站。如果你在進行網絡開發，想要使用者在沒有網絡的情況下也能打開網站，那麼這無疑是一個很有用的功能。通過在浏覽器位址欄輸入chrome://flags/#enable-offline-mode，啟用“激活離線緩存模式”可以開啟離線模式。
不要忘記重新開機 chrome 浏覽器使設定生效。
可将 html 拖放到編輯器
有時你需要複制你的 html 元素到編輯器。取代手動複制和粘貼到編輯器，現在你可以更加便捷地拖動 dom（文本對象模型）并将其放置進編輯器内想要的位置。
目前，你隻能拖動一個元素，而且它的子元素不會被一并拖動過來。這方面的缺陷可能會在以後的版本裡得到改善。
css 稽核
現在你可以對你的 css 進行稽核，比如檢查沒有在 web 頁面使用的無用的樣式規則。在“audits”（稽核）選項，點選“run”（運作）按鈕，你将會看到一個目前在該頁面沒有使用到的類/選擇器的清單，如下圖所示：
增加 sourcemap
使用 sourcemap，你可以看到未建立或未編譯的 css 或 javascript (js）版本。此功能對于那些在創作風格或者腳本語言上使用 sass、 less 或者 coffeescript 作為預處理器的開發者來說是非常有用的。啟用 sourcemap，你可以通過某行某列的具體數字找到生成的 js 或 css 的代碼位置。最新版本的 chrome 允許你手動添加 sourcemap。
要做到這一點的話，首先你要確定處于源面闆，接着打開一個檔案，在那之後右鍵單擊并選擇 add source map. 添加到 .map 檔案。