提升網站頁面速度的14條最佳實踐（一）

PAMPANG 發布于2019-08-30 10:53 / 932人閱讀

摘要：一直忙于工作，最近這段時間終于可以靜下心來細讀一些與工作相關的書籍。第二部分見提升網站頁面速度的條最佳實踐二。高性能網站建設指南一書共列舉了條提升網站速度的方法，本篇就前種進行總結。

一直忙于工作，最近這段時間終于可以靜下心來細讀一些與工作相關的書籍。本篇文章是《高性能網站建設指南》一書的梳理。
希望自己收獲的同時，也能給對這塊知識感興趣的童鞋給與入門指導。
關于《高性能網站建設指南》的梳理共有兩部分內容，本篇為第一部分。第二部分見提升網站頁面速度的14條最佳實踐（二）。
《高性能網站建設指南》一書共列舉了14條提升網站速度的方法，本篇就前7種進行總結。

一、減少http請求

1.圖片地圖
2.CSS Sprites
3.內聯圖片
4.合并腳本和樣式表

二、使用內容發布網絡

內容發布網絡（CDN）是一組分布在不同地理位置的web服務器，用于更加有效地像用戶發布內容。即利用就近原則，響應發送給用戶需要的數據，進而縮短響應時間，來提高網站性能。

三、添加Expires頭

瀏覽器（和代理）使用緩存來減少HTTP請求的數量，并減少HTTP響應的大小，使web頁面加載得更快。web服務器使用Expires頭來告訴web客戶端它可以使用一個組件的當前副本。

注意：Expires頭使用的是一個特定的時間，它要求客戶端與服務器的時鐘嚴格同步，一旦兩個時間統一，Expires頭的時間將沒有意義。

為了解決Expires頭的限制，HTTP1.1 引入了Cache-Control使用max-age指令指定組件緩存多久。它以秒為單位定義更新窗。如果從組件請求開始過去的秒數小于max-age，瀏覽器就可以使用緩存的版本。

注意：
    1.在小于HTTP1.1版本之前仍需要設置Expires頭，為了做更好的兼容，最好同時使用HTTP1.1和max-age，在支持max-age的版本中，如果兩者同時存在max-age會重寫Expires頭。
    2.利用Apache模塊mod_expires可以使Expires頭能夠像max-age那樣以相對的方式設置日期。通過Expires_Default指令來實現。時間可以用年/月/周/日/時/分/秒為單位來設置。

四、壓縮組件

1.從HTTP1.1開始，web客戶端可以通過HTTP請求中的Accept-Encoding頭來識別對壓縮的支持。
Accept-Encoding:gzip,deflate;
2.配置
a.Apache1.3的gzip壓縮由mod_gzip模塊提供
b.Apache2.x中壓縮通過mod_deflate模塊來完成。
3.代理緩存
在Web服務器的響應中添加Vary頭。Web服務器可以告訴代理根據一個或者多個請求頭來改變緩存的響應。
Vary:Accept-Encoding
這種情況下代理服務器會緩存每個響應的兩個版本——Accept-Encoding為gzip時的壓縮內容和沒指定Accept-Encoding時的非壓縮內容。

五、將樣式表放在頂部

由于瀏覽器總是在樣式表加載并解析完之后才會繪制頁面內容，所以把樣式表放在底部才會出現白屏或者無樣式內容的閃爍問題。

六、將腳本放在頁面底部

瀏覽器總是從上到下執行頁面內容，如果將腳本放置在頁面頂部，則在加載腳本的這段時間內，頁面的內容呈現將被阻塞！

七、避免css表達式

css表達式也會影響頁面的加載時間。如果必須要在頁面加載記載的時候對css樣式進行重置，可以考慮使用時間處理器來代替css表達式。

云服務器 GPU云服務器 api設計的最佳實踐最佳實踐最佳頁面置換算法的歷史 webrtc最佳實踐

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/114636.html

提升網站頁面速度的14條最佳實踐（一）

摘要：一直忙于工作，最近這段時間終于可以靜下心來細讀一些與工作相關的書籍。第二部分見提升網站頁面速度的條最佳實踐二。高性能網站建設指南一書共列舉了條提升網站速度的方法，本篇就前種進行總結。一直忙于工作，最近這段時間終于可以靜下心來細讀一些與工作相關的書籍。本篇文章是《高性能網站建設指南》一書的梳理。希望自己收獲的同時，也能給對這塊知識感興趣的童鞋給與入門指導。關于《高性能網站建設指南》的梳...

ivyzhang 2019-08-26 13:48 評論0 收藏0
提升網站頁面速度的14條最佳實踐（二）

摘要：唯一的格式約束是該字符串必須用引號引起來。對于網站背后的服務器來說，不大相同。不過用戶不必忍受整個頁面的重新加載了，而且用戶在等待時，仍然可以響應。本篇是對《高性能網站建設指南》一書的后7種規則進行梳理。八、使用外部Jacascript和css 1.如果需要呈現給用戶的頁面可以實現完整緩存，那么使用外部Jacascript和css會提高網站性能。 2.在使用使用外部Jacascr...

rainyang 2019-08-26 13:51 評論0 收藏0
提升網站頁面速度的14條最佳實踐（二）

摘要：唯一的格式約束是該字符串必須用引號引起來。對于網站背后的服務器來說，不大相同。不過用戶不必忍受整個頁面的重新加載了，而且用戶在等待時，仍然可以響應。本篇是對《高性能網站建設指南》一書的后7種規則進行梳理。八、使用外部Jacascript和css 1.如果需要呈現給用戶的頁面可以實現完整緩存，那么使用外部Jacascript和css會提高網站性能。 2.在使用使用外部Jacascr...

shengguo 2019-08-30 10:57 評論0 收藏0