YSLOW

YSLOW

YSlow 是Yahoo發布的一款基於FireFox的外掛程式,這個外掛程式可以分析網站的頁面,並告訴你為了提高網站性能,如何基於某些規則而進行最佳化。

概述

如何安裝YSlow?

安裝YSlow必須首先先安裝 Firebug,然後下載YSlow,再對其安裝。

YSlow有什麼用?

YSlow可以對網站的頁面進行分析,並告訴你為了提高網站性能,如何基於某些規則而進行最佳化。

YSlow可以分析任何網站,並為每一個規則產生一個整體報告,如果頁面可以進行最佳化,則YSlow會列出具體的修改意見。

Yslow-23條規則

1. 減少HTTP請求次數

合併圖片、CSS、JS,改進首次訪問用戶等待時間。

2. 使用CDN

就近快取==>智慧型路由==>負載均衡==>WSA全站動態加速

3. 避免空的src和href

當link標籤的href屬性為空、script標籤的src屬性為空的時候,瀏覽器渲染的時候會把當前頁面的URL作為它們的屬性值,從而把頁面的內容載入進來作為它們的值。測試

4. 為檔案頭指定Expires

使內容具有快取性。避免了接下來的頁面訪問中不必要的HTTP請求。

5. 使用gzip壓縮內容

壓縮任何一個文本類型的回響,包括XML和JSON,都是值得的。舊文章

6. 把CSS放到頂部

7. 把JS放到底部

防止js載入對之後資源造成阻塞。

8. 避免使用CSS表達式

9. 將CSS和JS放到外部檔案中

目的是快取,但有時候為了減少請求,也會直接寫到頁面里,需根據PV和IP的比例權衡。

10. 權衡DNS查找次數

減少主機名可以節省回響時間。但同時,需要注意,減少主機會減少頁面中並行下載的數量。

IE瀏覽器在同一時刻只能從同一域名下載兩個檔案。當在一個頁面顯示多張圖片時,IE 用戶的圖片下載速度就會受到影響。所以新浪會搞N個二級域名來放圖片。

11. 精簡CSS和JS

12. 避免跳轉

同域:注意避免反斜槓 “/” 的跳轉;

跨域:使用Alias或者mod_rewirte建立CNAME(保存域名與域名之間關係的DNS記錄)

13. 刪除重複的JS和CSS

重複調用腳本,除了增加額外的HTTP請求外,多次運算也會浪費時間。在IE和Firefox中不管腳本是否可快取,它們都存在重複運算JavaScript的問題。

14. 配置ETags

它用來判斷瀏覽器快取里的元素是否和原來伺服器上的一致。比last-modified date更具有彈性,例如某個檔案在1秒內修改了10次,Etag可以綜合Inode(檔案的索引節點(inode)數),MTime(修改時間)和Size來精準的進行判斷,避開UNIX記錄MTime只能精確到秒的問題。 伺服器集群使用,可取後兩個參數。使用ETags減少Web套用頻寬和負載

15. 可快取的AJAX

“異步”並不意味著“即時”:Ajax並不能保證用戶不會在等待異步的JavaScript和XML回響上花費時間。

16. 使用GET來完成AJAX請求

當使用XMLHttpRequest時,瀏覽器中的POST方法是一個“兩步走”的過程:首先傳送檔案頭,然後才傳送數據。因此使用GET獲取數據時更加有意義。

17. 減少DOM元素數量

是否存在一個是更貼切的標籤可以使用?人生不僅僅是DIV+CSS

18. 避免404

有些站點把404錯誤回響頁面改為“你是不是要找***”,這雖然改進了用戶體驗但是同樣也會浪費伺服器資源(如資料庫等)。最糟糕的情況是指向外部 JavaScript的連結出現問題並返回404代碼。首先,這種載入會破壞並行載入;其次瀏覽器會把試圖在返回的404回響內容中找到可能有用的部分當作JavaScript代碼來執行。

19. 減少Cookie的大小

20. 使用無cookie的域

比如圖片 CSS 等,Yahoo! 的靜態檔案都在主域名以外,客戶端請求靜態檔案的時候,減少了 Cookie 的反覆傳輸對主域名的影響。

21. 不要使用濾鏡

png24的在IE6半透明那種東西,別亂使,淡定的切成PNG8+jpg

22. 不要在HTML中縮放圖片

23. 縮小favicon.ico並快取

相關詞條

相關搜尋

熱門詞條

聯絡我們