YSlow 規則中13 條解釋(轉)

YSlow 規則中一共有13條,其中比較重要的有11條,先簡單說說各自的大概解釋:

1、Make fewer HTTP requests--更少的http請求,也就是說頁面中儘量少的引用外部靜態資源,js、css以及圖片

2、Use a CDN--使用CDN網絡,將頁面中的靜態資源分佈到離用戶最近的網絡節點上

3、Add an Expires header--爲靜態資源文件增加過期時間,讓用戶通過本地緩存來更快的訪問網站

4、Gzip components--壓縮靜態資源內容,減少網絡傳輸時間

5、Put CSS at the top--將CSS放在頁面頭部,能夠更快渲染頁面

6、Put JS at the bottom--將JS放在頁面底部,一般情況下JS的下載是阻塞模式的,放在頁面頂部會阻塞其他資源的下載

7、Avoid CSS expressions--不要使用CSS表達式,因爲CSS表達式需要很多資源,有時甚至會造成頁面假死

8、Make JS and CSS external--將CSS和JS使用外部的獨立文件,這點有點和1衝突,但是仔細分析下,並不矛盾

9、Reduce DNS lookups--減少DNS查找(這點我後面詳細解釋下)

10、Minify JS--最小化壓縮JS,和第4點不同,使用YUI Compressor或者JSMin將JS文件進行分析,將一些變量名變短,去除不必要的空格和符號

11、Avoid redirects--避免無意義的跳轉

12、Remove duplicate scripts--去除重複的腳本,不光是文件,甚至是同功能的函數

13、Configure ETags--配置實體標籤


今天先講講比較容易做到的幾點(實現難易程度不一樣,注意先後次序):

YSlow第八條:這點我相信大家比較容易理解,而且很多都已經實施,就是將CSS和JS獨立成相應的文件,使用link和script標籤應用;

YSlow第三條:因爲靜態資源文件(CSS\JS\IMG統稱靜態資源文件)往往是變化不大的,那麼可以在HTTP頭中增加相應的過期時間,讓瀏覽器緩存在本地,這樣當第二次使用的時候,就不會下載全部內容,只是進行狀態檢查;

YSlow第四條:也很好理解,將靜態內容壓縮後,減少網絡傳輸時間;因爲IIS的壓縮設置相對較煩,可以使用第三方工具,如IISxpress,支持32位和64位,而且還有一個技術交流版的授權;

做到以上三點,網頁速度已經有比較明顯的加速了,還有幾點雖然略微麻煩,但是也是很好的加分手段:

YSlow第十條:最小化JS文件,我們寫的JS往往包含空格、TAB等對JS執行沒用影響的字符,但是這卻實 實在在的增加了JS的體積,使用工具能夠去除這些無用的字符,減少文件體積。但是同樣帶來的問題就是,JS不能有錯誤,另外壓縮後的JS代碼很難閱讀,所 以如何在開發時和發佈時協調好就是很大的問題,爲了這點我們使用不同的文件引用,在開發時(DEBUG)使用未壓縮版,在發佈時(RELEASE)使用壓 縮版,使用#if #else #endif引用不同的文件;

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章