前言
收集了一些工作中常用到的 Chrome 除錯技巧，其他大部分 Chrome 除錯功能工具介紹已經在其他的很多文章中介紹到了，這裡就不 DRY 了
Request blocking 阻塞請求
使用這個功能可以攔截請求
大部分情況是頁面執行完某個操作後，頁面就重定向了（比如登入），這時就不方便除錯了，下面這個工具很好的解決了這個問題
比如你想了解在頁面重定向之前，發去的登入請求都做了什麼，使用操作如下圖所示：
Coverage 程式碼覆蓋率
可以觀察到程式碼覆蓋率，哪些是沒用的，去除無用程式碼，較少程式碼體積
你需要點選下圖的記錄按鈕進行記錄，然後你需要在頁面上進行一些互動操作（如點選、滑鼠移入等）
然後你會得到下圖，紅色的部分是沒有用到的程式碼佔比，綠色部分是用到的程式碼佔比，你可以點選佔比進度條，到達指定原始碼區進行細緻檢視
Changes 變化
顯示更改程式碼的比較，你可以通過這個工具觀察，你用控制檯修改過的程式碼，就和 git 的 diff 功能類似，紅色代表刪除、綠色程式碼新增
你如果點選程式碼裡的某一行，它會開啟原始碼皮膚，你可以在這裡進行修改、除錯操作
Snippets 程式碼片段
一般在 console 裡可以臨時執行程式碼，但是書寫格式不太友好，而且一換行就執行了（當然你可以 shift+enter 換行），這時，你又懶癌發作，不想開啟程式碼編輯器，你可以使用 Snippets 這個工具，如下圖所示：
可以像程式碼編輯器一樣書寫，可以格式化程式碼、可以斷點除錯、也可以單獨匯出檔案