谷歌瀏覽器network請求時間分析及優(yōu)化方法:network工具功能強(qiáng)大,能夠讓我看到網(wǎng)頁加載的信息,比如加載時間,和先后順序,是否是并行加載,還是堵塞加載。 ?。?).Name:表示加載的文件名。 (2).Method:表示請求的方式。 ?。?).Status:表示狀態(tài)碼(200為請求成功,304表示從緩存讀取)。 ?。?).Type:表示文件的MIME Type的類型。 ?。?).Initiator:表示發(fā)出這個文件請求的發(fā)出者。 ?。?).Size:表示文件大小。 ?。?).Time:表示每個請求的總時長。 ?。?).Timeline:以圖表的形式顯示元素的請求和加載情況。 當(dāng)然內(nèi)容不僅僅先于以上8個,右擊上面八個任意一個選項(xiàng)卡可以彈出一個菜單,可以查看更多內(nèi)容: (1).Stalled(阻塞) 瀏覽器得到要發(fā)出這個請求的指令,到請求可以發(fā)出的等待時間,一般是代理協(xié)商、以及等待可復(fù)用的TCP連接釋放的時間,不包括DNS查詢、建立TCP連接等時間等。 瀏覽器對同一個主機(jī)域名的并發(fā)連接數(shù)有限制,因此如果當(dāng)前的連接數(shù)已經(jīng)超過上限,那么其余請求就會被阻塞,等待新的可用連接;此外腳本也會阻塞其他組件的下載; 優(yōu)化措施: 1、將資源合理分布到多臺主機(jī)上,可以提高并發(fā)數(shù),但是增加并行下載數(shù)量也會增大開銷,這取決于帶寬和CPU速度,過多的并行下載會降低性能; 2、腳本置于頁面底部; (2)DNS Lookup(域名解析) 請求某域名下的資源,瀏覽器需要先通過DNS解析器得到該域名服務(wù)器的IP地址。在DNS查找完成之前,瀏覽器不能從主機(jī)名那里下載到任何東西。 優(yōu)化措施: 1、利用DNS緩存(設(shè)置TTL時間); 2、利用Connection:keep-alive特性建立持久連接,可以在當(dāng)前連接上進(jìn)行多個請求,無需再進(jìn)行域名解析; (3)Initial connection(初始化連接) TCP建立連接的三次握手時間 (4)Request sent(發(fā)送請求) 請求第一個字節(jié)發(fā)出前到最后一個字節(jié)發(fā)出后的時間,也就是上傳時間。 發(fā)送HTTP請求的時間(從第一個bit到最后一個bit) 優(yōu)化措施: 1、減少HTTP請求,可以使用CSS Sprites、內(nèi)聯(lián)圖片、合并腳本和樣式表等; 2、對不常變化的組件添加長久的Expires頭(相當(dāng)于設(shè)置久遠(yuǎn)的過期時間),在后續(xù)的頁面瀏覽中可以避免不必要的HTTP請求; 請求發(fā)出后,到收到響應(yīng)的第一個字節(jié)所花費(fèi)的時間(Time To First Byte)。 通常是耗費(fèi)時間最長的。從發(fā)送請求到收到響應(yīng)之間的空隙,會受到線路、服務(wù)器距離等因素的影響。 優(yōu)化措施: 1、使用CDN,將用戶的訪問指向距離最近的工作正常的緩存服務(wù)器上,由緩存服務(wù)器直接響應(yīng)用戶請求,提高響應(yīng)速度; (4)Content Download(下載) 收到響應(yīng)的第一個字節(jié),到接受完最后一個字節(jié)的時間,就是下載時間。 下載HTTP響應(yīng)的時間(包含頭部和響應(yīng)體) 優(yōu)化措施: 1、通過條件Get請求,對比If-Modified-Since和Last-Modified時間,確定是否使用緩存中的組件,服務(wù)器會返回“304 Not Modified”狀態(tài)碼,減小響應(yīng)的大??; 2、移除重復(fù)腳本,精簡和壓縮代碼,如借助自動化構(gòu)建工具grunt、gulp等; 3、壓縮響應(yīng)內(nèi)容,服務(wù)器端啟用gzip壓縮,可以減少下載時間; |
|