前言

有時候為了使用者體驗，我們做開發必須考慮弱網情況下訪問體驗，比如載入順序，首屏在弱網的展示等；
有些小夥伴推薦用fiddler4 【用過，感覺還可以，功能很強大，自我感覺有些臃腫】,但是在chrome也有弱網模擬的【用來搞前端介面請求，頁面渲染的模擬足夠用了】

使用

我不知道這個功能首次出現在什麼版本，已知的只有chrome45+

按下F12 -> 開啟除錯控制檯，迷你選單的Network選項，看截圖

有三個功能比較實用，可以用來測試使用者訪問；

1. Disable Cache(禁用快取 – 開啟這個就測試介面就不用每次到高階清理了)
2. Preserve log(保留日誌 — 重新整理重新載入也保留)
3. No throttling(裡面可以模擬多種網路的訪問)，看下面的圖圖，選擇一種網路情況，重新載入頁面就能感受到弱網的氣息了。。。
   

還有兩個小功能，用的不多。。但是可以看情況使用，就是過濾功能

1. Regex – 開啟正則，不需要//包裹
2. Hide data URLs – 這個是過濾data協議的東西（比如base64的圖片），若是頁面請求非常多的情況下，勾選這個，可以讓我們更快速的定位一些請求

因為預設展出的是ALL（所有請求）；

當然也可以點選這些，進行型別的分類篩選，快速定位

總結

chrome的除錯功能非常豐富和強大，還可以藉助外掛進行react和vue的除錯