雅虎的Web優化最佳實踐

1.? 內容優化

• 盡量減少HTTP請求：常見方法包括合并多個CSS文件和JavaScript文件，利用CSS?Sprites整合圖像，Image map（圖像中不同的區域設置不同的鏈接），內聯圖象（使用? data:?URL?scheme?在實際的頁面嵌入圖像數據）等。
• 減少DNS查找
• 避免重定向
• 使Ajax可緩存
• 延遲加載組件：考慮哪些內容是頁面呈現時所必需首先加載的、哪些內容和結構可以稍后再加載，根據這個優先級進行設定。
• 預加載組件：預加載是在瀏覽器空閑時請求將來可能會用到的頁面內容（如圖像、樣式表和腳本）。當用戶要訪問下一個頁面時，頁面中的內容大部分已經加載到緩存中了，因此可以大大改善訪問速度。
• 減少DOM元素數量：頁面中存在大量DOM?元素，會導致JavaScript遍歷DOM的效率變慢。
• 根據域名劃分頁面內容：把頁面內容劃分成若干部分可以使你最大限度地實現平行下載。但要確保你使用的域名數量在2個到4個之間（否則與第2條沖突）。
• 最小化iframe的數量：iframes 提供了一個簡單的方式把一個網站的內容嵌入到另一個網站中。但其創建速度比其他包括JavaScript和CSS的DOM元素的創建慢了1-2個數量級。
• 避免404：HTTP請求時間消耗是很大的，因此使用HTTP請求來獲得一個沒有用處的響應（例如404沒有找到頁面）是完全沒有必要的，它只會降低用戶體驗而不會有一點好處。

2. 服務器優化

• 使用內容分發網絡（CDN）：把你的網站內容分散到多個、處于不同地域位置的服務器上可以加快下載速度。
• 添加Expires或Cache-Control信息頭：對于靜態內容，可設置文件頭過期時間Expires的值為“Never expire（永不過期）”；對于動態內容，可使用恰當的Cache-Control文件頭來幫助瀏覽器進行有條件的請求。
• Gzip壓縮
• 設置ETag：ETags（Entity tags，實體標簽）是web服務器和瀏覽器用于判斷瀏覽器緩存中的內容和服務器中的原始內容是否匹配的一種機制。
• 提前刷新緩沖區： 當用戶請求一個頁面時，服務器會花費200到500毫秒用于后臺組織HTML文件。在這期間，瀏覽器會一直空閑等待數據返回。在PHP中，可以使用 flush()方法，它允許你把已經編譯的好的部分HTML響應文件先發送給瀏覽器，這時瀏覽器就會可以下載文件中的內容（腳本等）而后臺同時處理剩余的 HTML頁面。
• 對Ajax請求使用GET方法：當使用XMLHttpRequest時，瀏覽器中的POST方法會首先發送文件頭，然后才發送數據。因此使用GET最為恰當。
• 避免空的圖像src

3. Cookie優化

• 減小cookie大小：去除不必要的coockie，并使coockie體積盡量小以減少對用戶響應的影響
• 針對Web組件使用域名無關的Cookie：對靜態組件的Cookie讀取是一種浪費，使用另一個無Cookie的域名來存放靜態組件是一個好方法，或者也可以在Cookie中只存放帶www的域名。

4. CSS優化

• 將CSS代碼放在HTML頁面的頂部
• 避免使用CSS表達式：CSS表達式在執行時候的運算量非常大，會對頁面性能產生大的影響
• 使用<link>來代替@import
• 避免使用Filters：IE獨有屬性AlphaImageLoader用于修正IE 7以下版本中PNG圖片的半透明效果，但它的問題在于瀏覽器加載圖片時它會終止內容的呈現并且凍結瀏覽器。

5. JavaScript優化

• 將JavaScript腳本放在頁面的底部
• 將JavaScript和CSS作為外部文件來引用：在實際應用中使用外部文件可以提高頁面速度，因為JavaScript和CSS文件都能在瀏覽器中產生緩存。
• 縮小JavaScript和CSS
• 刪除重復的腳本
• 最小化DOM的訪問：使用JavaScript訪問DOM元素比較慢
• 開發智能的事件處理程序

6. 圖像優化

• 優化圖片大小
• 通過CSS Sprites優化圖片
• 不要在HTML中使用縮放圖片
• favicon.ico要小而且可緩存

7. 針對移動優化

• 保持組件大小在25KB以下：主要是因為iPhone不能緩存大于25K的文件（注意這里指的是解壓縮后的大小）。
• 將組件打包成為一個復合文檔：把頁面內容打包成復合文本就如同帶有多附件的Email，它能夠使你在一個HTTP請求中獲取多個組件。

更多信息：http://developer.yahoo.com/performance/rules.html（中文翻譯）

轉載于:https://www.cnblogs.com/FineDay/articles/3553913.html

總結

以上是生活随笔為你收集整理的雅虎的Web优化最佳实践的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。