Yahoo!的Exceptional Performance團隊為改善Web性能帶來最佳實踐。他們?yōu)榇诉M行了 一系列的實驗、開發(fā)了各種工具、寫了大量的文章和博客并在各種會議上參與探討。最佳實踐的核心就是旨在提高網(wǎng)站性能。

Excetional Performance 團隊總結出了一系列可以提高網(wǎng)站速度的方法。可以分為 7 大類 34 條。包括內(nèi)容、服務器、cookie、CSS、JavaScript、圖片、移動應用等七部分。

其中內(nèi)容部分一共十條建議：

內(nèi)容部分

1. 盡量減少HTTP請求

2. 減少DNS查找

3. 避免跳轉

4. 緩存Ajxa

5. 推遲加載

6. 提前加載

7. 減少DOM元素數(shù)量

8. 用域名劃分頁面內(nèi)容

9. 使frame數(shù)量最少

10. 避免 404 錯誤

1、盡量減少 HTTP 請求次數(shù)

終端用戶響應的時間中，有 80%用于下載各項內(nèi)容。這部分時間包括下載頁面中的圖像、 樣式表、腳本、Flash 等。通過減少頁面中的元素可以減少 HTTP 請求的次數(shù)。這是提高 網(wǎng)頁速度的關鍵步驟。 減少頁面組件的方法其實就是簡化頁面設計。那么有沒有一種方法既能保持頁面內(nèi)容的 豐富性又能達到加快響應時間的目的呢？這里有幾條減少 HTTP 請求次數(shù)同時又可能保持頁面內(nèi)容豐富的技術。

合并文件是通過把所有的腳本放到一個文件中來減少 HTTP 請求的方法，如可以簡單地 把所有的 CSS 文件都放入一個樣式表中。當腳本或者樣式表在不同頁面中使用時需要做 不同的修改，這可能會相對麻煩點，但即便如此也要把這個方法作為改善頁面性能的重 要一步。

CSS Sprites是減少圖像請求的有效方法。把所有的背景圖像都放到一個圖片文件中， 然后通過CSS的background-image和background-position屬性來顯示圖片的不同部分；

圖片地圖是把多張圖片整合到一張圖片中。雖然文件的總體大小不會改變，但是可以減 少 HTTP 請求次數(shù)。圖片地圖只有在圖片的所有組成部分在頁面中是緊挨在一起的時候 才能使用，如導航欄。確定圖片的坐標和可能會比較繁瑣且容易出錯，同時使用圖片地 圖導航也不具有可讀性，因此不推薦這種方法；

內(nèi)聯(lián)圖像是使用data:URL scheme的方法把圖像數(shù)據(jù)加載頁面中。這可能會增加頁面的 大小。把內(nèi)聯(lián)圖像放到樣式表（可緩存）中可以減少HTTP請求同時又避免增加頁面文件 的大小。但是內(nèi)聯(lián)圖像現(xiàn)在還沒有得到主流瀏覽器的支持。

減少頁面的HTTP請求次數(shù)是你首先要做的一步。這是改進首次訪問用戶等待時間的最重 要的方法。如同Tenni Theurer的他的博客Browser Cahe Usage – Exposed!中所說， HTTP請求在無緩存情況下占去了 40%到 60%的響應時間。讓那些初次訪問你網(wǎng)站的人獲 得更加快速的體驗吧！

2、減少DNS查找次數(shù)

域名系統(tǒng)（DNS）提供了域名和IP的對應關系，就像電話本中人名和他們的電話號碼的 關系一樣。當你在瀏覽器地址欄中輸入www.800hr.com時，DNS解析服務器就會返回這個 域名對應的IP地址。DNS解析的過程同樣也是需要時間的。一般情況下返回給定域名對 應的IP地址會花費 20 到 120 毫秒的時間。而且在這個過程中瀏覽器什么都不會做直到 DNS查找完畢。

緩存 DNS 查找可以改善頁面性能。這種緩存需要一個特定的緩存服務器，這種服務器一 般屬于用戶的 ISP 提供商或者本地局域網(wǎng)控制，但是它同樣會在用戶使用的計算機上產(chǎn) 生緩存。

DNS 信息會保留在操作系統(tǒng)的 DNS 緩存中（微軟 Windows 系統(tǒng)中 DNS Client Service）。大多數(shù)瀏覽器有獨立于操作系統(tǒng)以外的自己的緩存。由于瀏覽器有自己的 緩存記錄，因此在一次請求中它不會受到操作系統(tǒng)的影響。

Internet Explorer 默認情況下對 DNS 查找記錄的緩存時間為 30 分鐘，它在注冊表中的 鍵值為 DnsCacheTimeout。Firefox 對 DNS 的查找記錄緩存時間為 1 分鐘，它在配置文 件中的選項為 network.dnsCacheExpiration（Fasterfox 把這個選項改為了 1 小時）。

當客戶端中的 DNS 緩存都為空時（瀏覽器和操作系統(tǒng)都為空），DNS 查找的次數(shù)和頁面 中主機名的數(shù)量相同。這其中包括頁面中 URL、圖片、腳本文件、樣式表、Flash 對象 等包含的主機名。減少主機名的數(shù)量可以減少 DNS 查找次數(shù)。

減少主機名的數(shù)量還可以減少頁面中并行下載的數(shù)量。減少 DNS 查找次數(shù)可以節(jié)省響應 時間，但是減少并行下載卻會增加響應時間。我的指導原則是把這些頁面中的內(nèi)容分割 成至少兩部分但不超過四部分。這種結果就是在減少 DNS 查找次數(shù)和保持較高程度并行 下載兩者之間的權衡了。

3、避免跳轉

跳轉是使用 301 和 302 代碼實現(xiàn)的。下面是一個響應代碼為 301 的 HTTP 頭：HTTP/1.1 301 Moved Permanently

Location: http://example.com/newuri

Content-Type: text/html

瀏覽器會把用戶指向到 Location 中指定的 URL。頭文件中的所有信息在一次跳轉中都是 必需的，內(nèi)容部分可以為空。不管他們的名稱，301 和 302 響應都不會被緩存除非增加 一個額外的頭選項，如 Expires 或者 Cache-Control 來指定它緩存。<meat />元素的刷 新標簽和 JavaScript 也可以實現(xiàn) URL 的跳轉，但是如果你必須要跳轉的時候，最好的

方法就是使用標準的 3XXHTTP 狀態(tài)代碼，這主要是為了確保"后退"按鈕可以正確地使用。

但是要記住跳轉會降低用戶體驗。在用戶和 HTML 文檔中間增加一個跳轉，會拖延頁面 中所有元素的顯示，因為在 HTML 文件被加載前任何文件（圖像、Flash 等）都不會被下 載。

有一種經(jīng)常被網(wǎng)頁開發(fā)者忽略卻往往十分浪費響應時間的跳轉現(xiàn)象。這種現(xiàn)象發(fā)生在當 URL 本該有斜杠（/）卻被忽略掉時。例如，當我們要訪問 http://astrology.yahoo.com/astrology 時，實際上返回的是一個包含 301 代碼的跳 轉，它指向的是 http://astrology.yahoo.com/astrology/ （注意末尾的斜杠）。在 Apache 服務器中可以使用 Alias 或者 mod_rewrite 或者 the DirectorySlash 來避免。

連接新網(wǎng)站和舊網(wǎng)站是跳轉功能經(jīng)常被用到的另一種情況。這種情況下往往要連接網(wǎng)站 的不同內(nèi)容然后根據(jù)用戶的不同類型（如瀏覽器類型、用戶賬號所屬類型）來進行跳轉。

使用跳轉來實現(xiàn)兩個網(wǎng)站的切換十分簡單，需要的代碼量也不多。盡管使用這種方法對 于開發(fā)者來說可以降低復雜程度，但是它同樣降低用戶體驗。一個可替代方法就是如果 兩者在同一臺服務器上時使用 Alias 和 mod_rewrite 和實現(xiàn)。如果是因為域名的不同而 采用跳轉，那么可以通過使用 Alias 或者 mod_rewirte 建立 CNAME（保存一個域名和另 外一個域名之間關系的 DNS 記錄）來替代。

標簽： Web程序優(yōu)化 網(wǎng)站內(nèi)容 網(wǎng)站優(yōu)化 

版權申明：本站文章部分自網(wǎng)絡，如有侵權，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉載文章言論不代表本站觀點！
本站所提供的圖片等素材，版權歸原作者所有，如需使用，請與原作者聯(lián)系。