network-getruleData.do

Network面板

概述

Network面板可以記錄頁面上的網路請求的詳情資訊，從發起網頁頁面請求Request後分析HTTP請求後得到的各個請求資源資訊（包括狀態、資源型別、大小、所用時間、Request和Response等），可以根據這個進行網路效能優化。

我把Google官方網站上介紹Network面板的圖貼到這裡，該面板主要包括5大塊窗格(Pane)：

1. Controls 控制Network的外觀和功能。
2. Filters 控制Requests Table具體顯示哪些內容。
3. Overview
    顯示獲取到資源的時間軸資訊。
4. Requests Table 按資源獲取的前後順序顯示所有獲取到的資源資訊，點選資源名可以檢視該資源的詳細資訊。
5. Summary 顯示總的請求數、資料傳輸量、載入時間資訊。

其中 Requests Table 顯示如下資訊列：

• Name 資源名稱，點選名稱可以檢視資源的詳情情況，包括Headers、Preview、Response、Cookies、Timing。
• Status HTTP狀態碼。
• Type 請求的資源MIME型別。
• Initiator
   標記請求是由哪個物件或程序發起的（請求源）。
  • Parser： 請求由Chrome的HTML解析器時發起的。
  • Redirect：請求是由HTTP頁面重定向發起的。
  • Script：請求是由Script指令碼發起的。
  • Other：請求是由其他程序發起的，比如使用者點選一個連結跳轉到另一個頁面或者在位址列輸入URL地址。
• Size 從伺服器下載的檔案和請求的資源大小。如果是從快取中取得的資源則該列會顯示(from cache)
• Time 請求或下載的時間，從發起Request到獲取到Response所用的總時間。
• Timeline 顯示所有網路請求的視覺化瀑布流(時間狀態軸)，點選時間軸，可以檢視該請求的詳細資訊，點選列頭則可以根據指定的欄位可以排序。