提高網站性能中內容有關的10條原則

2024-08-30 08:33:58

字體：大中小

來源：轉載

供稿：網友

英文地址：http://developer.yahoo.com/performance/rules.html
Yahoo!的Exceptional Performance團隊為改善Web性能帶來最佳實踐。他們為此進行了一系列的實驗、開發了各種工具、寫了大量的文章和博客并在各種會議上參與探討。最佳實踐的核心就是旨在提高網站性能。
Excetional Performance團隊總結出了一系列可以提高網站速度的方法?？梢苑譃?大類34條。包括內容、服務器、cookie、CSS、JavaScript、圖片、移動應用等七部分。
其中內容部分一共十條建議：
一、內容部分

盡量減少HTTP請求減少DNS查找避免跳轉緩存Ajxa 推遲加載提前加載減少DOM元素數量用域名劃分頁面內容減小iframe的大小避免404錯誤
1、盡量減少HTTP請求次數
終端用戶響應的時間中，有80%用于下載各項內容。這部分時間包括下載頁面中的圖像、樣式表、腳本、Flash等。通過減少頁面中的元素可以減少HTTP請求的次數。這是提高網頁速度的關鍵步驟。
減少頁面組件的方法其實就是簡化頁面設計。那么有沒有一種方法既能保持頁面內容的豐富性又能達到加快響應時間的目的呢？這里有幾條減少HTTP請求次數同時又可能保持頁面內容豐富的技術。
合并文件是通過把所有的腳本放到一個文件中來減少HTTP請求的方法，如可以簡單地把所有的CSS文件都放入一個樣式表中。當腳本或者樣式表在不同頁面中使用時需要做不同的修改，這可能會相對麻煩點，但即便如此也要把這個方法作為改善頁面性能的重要一步。
CSS Sprites 是減少圖像請求的有效方法。把所有的背景圖像都放到一個圖片文件中，然后通過CSS的background-image和background-position屬性來顯示圖片的不同部分；
圖片地圖是把多張圖片整合到一張圖片中。雖然文件的總體大小不會改變，但是可以減少HTTP請求次數。圖片地圖只有在圖片的所有組成部分在頁面中是緊挨在一起的時候才能使用，如導航欄。確定圖片的坐標和可能會比較繁瑣且容易出錯，同時使用圖片地圖導航也不具有可讀性，因此不推薦這種方法；
內聯圖像是使用 data:URL scheme 的方法把圖像數據加載頁面中。這可能會增加頁面的大小。把內聯圖像放到樣式表（可緩存）中可以減少HTTP請求同時又避免增加頁面文件的大小。但是內聯圖像現在還沒有得到主流瀏覽器的支持。點擊這里查看網頁制作教程頻道內容
減少頁面的HTTP請求次數是你首先要做的一步。這是改進首次訪問用戶等待時間的最重要的方法。如同Tenni Theurer的他的博客Browser Cahe Usage - Exposed!中所說，HTTP請求在無緩存情況下占去了40%到60%的響應時間。讓那些初次訪問你網站的人獲得更加快速的體驗吧！
2、減少DNS查找次數
域名系統（DNS）提供了域名和IP的對應關系，就像電話本中人名和他們的電話號碼的關系一樣。當你在瀏覽器地址欄中輸入www.dudo.org時，DNS解析服務器就會返回這個域名對應的IP地址。DNS解析的過程同樣也是需要時間的。一般情況下返回給定域名對應的IP地址會花費20到120毫秒的時間。而且在這個過程中瀏覽器什么都不會做直到DNS查找完畢。
緩存DNS查找可以改善頁面性能。這種緩存需要一個特定的緩存服務器，這種服務器一般屬于用戶的ISP提供商或者本地局域網控制，但是它同樣會在用戶使用的計算機上產生緩存。DNS信息會保留在操作系統的DNS緩存中（微軟Windows系統中DNS Client Service）。大多數瀏覽器有獨立于操作系統以外的自己的緩存。由于瀏覽器有自己的緩存記錄，因此在一次請求中它不會受到操作系統的影響。點擊這里查看網頁制作教程頻道內容
Internet Explorer默認情況下對DNS查找記錄的緩存時間為30分鐘，它在注冊表中的鍵值為DnsCacheTimeout。Firefox對DNS的查找記錄緩存時間為1分鐘，它在配置文件中的選項為network.dnsCacheExpiration（Fasterfox把這個選項改為了1小時）。
當客戶端中的DNS緩存都為空時（瀏覽器和操作系統都為空），DNS查找的次數和頁面中主機名的數量相同。這其中包括頁面中URL、圖片、腳本文件、樣式表、Flash對象等包含的主機名。減少主機名的數量可以減少DNS查找次數。
減少主機名的數量還可以減少頁面中并行下載的數量。減少DNS查找次數可以節省響應時間，但是減少并行下載卻會增加響應時間。我的指導原則是把這些頁面中的內容分割成至少兩部分但不超過四部分。這種結果就是在減少DNS查找次數和保持較高程度并行下載兩者之間的權衡了。

上一篇：提高網站性能中網站服務器的改進

下一篇：利用個性化搜索引擎查找需要的個性化信息