chrome谷歌瀏覽器開發者工具-網絡帶寬控制

　　有時候咱們想在本地測試一下圖片預加載loading的加載狀況，以下圖：

 

　　

 

　　可無奈通常網絡帶寬都比較好，基本上看不到效果，圖片一會兒就加載出來了，

　　可能這個時候有些小夥伴想到的辦法是用定時器延遲加載

　　其實Google Chrome開發者工具的Network面板提供了2個不錯的方法

 

 

　　方法一（推薦）以下圖選擇Network面板

　　第二行，最右邊的Online選項裏面的Fast 3G或者Slow 3G就能夠讓網絡帶寬變成3G網，這個時候通常就能夠看到效果啦

　　

 

　　注：若是你沒有看到該選項，建議把開發者工具拉寬一些，有時候是被擋住了；還有就是谷歌瀏覽器建議爲最新版本；

 

 

　　方法二：打開Network面板，點亮左上角攝像機的圖標（鼠標移上去會提示Capture screenshots），以下圖：

　　

 

 

 

　　點亮該圖標後，會打開新的一折疊面板，在該面板上會提示按Ctrl + R來啓動截圖，以下圖：

　　

 

 

 

　　按Ctrl + R後，截圖自動完成，雙擊截圖就能查看大圖；而且點擊截圖之後能夠查看該截圖時刻的Network狀況。以下圖所示：