【伯樂線上提示】：① 5月6日，谷歌開發者中心推出了一個 Web 開發最佳實踐手冊。伯樂線上資源頻道摘編該資源後，已邀請一些關注 Web 開發的朋友參與翻譯手冊。② 由於譯者朋友幾乎都是已在職，都是在工作之餘參與，每位的翻譯進度會不一樣（請理解），所以手冊中文版不會按照英文版章節順序釋出。③ 手冊中文版尚不完整，請不要轉載，謝謝合作。
為了儘快達到首次渲染，我們需要優化三個方面：
- 關鍵資源數量最小化。
- 關鍵位元組最小化。
- 關鍵路徑長度最小化。
關鍵資源是任何可能阻塞頁面初始渲染的資源。頁面上這種資源越少，瀏覽器獲取內容的工作越少，對CPU和其它資源的佔用就越少。
同樣，瀏覽器需要下載的關鍵位元組越少，它處理內容並顯示到螢幕的速度越快。減少位元組數可以通過減少資源的數量（去掉它們或者把它們變成非關鍵資源），並且確保通過壓縮和優化每個資源達到傳輸量最小化。
最終，關鍵路徑的長度是所有頁面的關鍵資源及其位元組大小之間的依賴函式：一些資源下載後僅初始化一次，先前的資源已被處理，資源越大伺服器往返次數越多，需要花時間下載它。
換言之，資源的數量，位元組數，關鍵路徑長度彼此依賴，但是它們並不完全相同。比如，你也許無法減少關鍵資源的數量，或者無法縮短關鍵路徑長度，但是減少了關鍵位元組數，這依舊是很重要的優化 —— 反之亦然。
優化關鍵渲染路徑的一般步驟：
- 分析和描述你的關鍵路徑：資源數量，位元組，長度。
- 關鍵資源數量最小化：捨棄它們，延遲載入，標記為非同步，等等。
- 優化剩餘關鍵資源的載入順序：越早下載所有的關鍵資源，越能縮短關鍵路徑長度。
- 優化關鍵位元組數，減少下載時間。（伺服器往返次數）
打賞支援我翻譯更多好文章，謝謝！
打賞譯者
打賞支援我翻譯更多好文章，謝謝！
任選一種支付方式
