6. Put JS at the bottom 把Javascript腳本盡量放到頁面底部加載。

一開始為以為Javascript腳本盡量放到頁面底部加載，是指所有的JS腳本都要放到底部，后來才發(fā)現(xiàn)，并不完全是這樣，這里所指的腳本是指那些在加載過程中要執(zhí)行的腳本，所以一般的處理辦法還是頁面頭部引入JS鏈接，頁面底部執(zhí)行JS腳本程序。為什么要這么做呢？呵呵，其實(shí)很簡單，為了實(shí)現(xiàn)最大的下載并行，頁面加載初期做的事，最好只有下載，HTML的下載，CSS的下載,JS的下載，等下載完成后再去實(shí)現(xiàn)頁面渲染，JS腳本運(yùn)行。這個方面我們還需要努力，很多頁面我們在加載過程中運(yùn)行了一部分腳本，或許是為了實(shí)現(xiàn)一些功能，沒有辦法，不過或許有更好的辦法來替代呢。。。

7. Avoid CSS expressions 避免CSS表達(dá)式

其實(shí)在CSS中運(yùn)行表達(dá)式和頁面加載中運(yùn)行大量的JS腳本差不多，或許還更慢，而且還不兼容，雖然可以使我們在頁面邏輯簡單不少，但是我們完全可以拋棄之。這個點(diǎn)，我們的頁面基本上都做到了。不過說實(shí)話，CSS表達(dá)式，嘿嘿，我以前還不知道有這么回事。慚愧。哈哈。

9. Reduce DNS lookups 盡可能少的DNS查找。

這項(xiàng)我們做的不是很好。D級，有9個域名，一般不要超過4個。不過這個主要是服務(wù)器架構(gòu)上的問題，我們也無能為力，現(xiàn)在單單首頁的廣告域名就有好幾個，好耶的廣告域名，雅虎的廣告域名，淘寶店廣告域名，打點(diǎn)的域名。如果去掉這些，我們其實(shí)還是夠用的，一個主域名，一個圖片的，一個STYLE的，最多加上IFREAM的剛好4個。

10. Minify JS 對Javascript 代碼進(jìn)行壓縮。

這點(diǎn)我很早以前就對此關(guān)注了，也找到了一個不錯的壓縮工具，yuicompressor，雅虎美國開發(fā)的JAVA壓縮包yuicompressor.jar。壓縮的相當(dāng)完美，不僅把代碼間的空格換行給去除掉了，而且對變量名，北部方法名都進(jìn)行的簡化，無意中實(shí)現(xiàn)了混淆腳本的作用?，F(xiàn)在我們僅僅做到了JS合并，并沒有對齊進(jìn)行壓縮，如果我用yuicompressor手工的去壓縮，雖然實(shí)現(xiàn)了JS壓縮，但是給我們自己的維護(hù)量增加了一倍，因?yàn)槲覀冃枰S護(hù)2套JS腳本，一套是壓縮前的（調(diào)試用的），一套是壓縮后（發(fā)布到網(wǎng)上的），而且要保證2套代碼一致。所以最完美的做法是在發(fā)布的時候?qū)崿F(xiàn)JS腳本合并，并對其用yuicompressor進(jìn)行壓縮，然后發(fā)布到晚上，把關(guān)鍵點(diǎn)移到發(fā)布的時候，這樣我們只需要關(guān)心一套JS腳本（發(fā)布前的版本）。而且我覺得這個方案完全是行動通的。

11. Avoid redirects 避免重定向（跳轉(zhuǎn)）

怎么理解這點(diǎn)呢？

我們經(jīng)常遇到的一種做法，注冊成功后，旺旺會有一個頁面提示“你已經(jīng)注冊成功，3秒后將自動跳轉(zhuǎn)到XX頁面”。我就覺得很奇怪，你為什么不直接跳轉(zhuǎn)到該去的頁面？還有一種，我們大家非常熟悉，一般我們頁面的鏈接都寫成：http://china.alibaba.com或者h(yuǎn)ttp://china.alibaba.com/,有人會問，有區(qū)別嗎？我明確的告訴大家，有！服務(wù)器如果接收到的URL是http://china.alibaba.com，它會自動重新定向到http://china.alibaba.com/，雖然最后都打開了阿里巴巴中文站的首頁，但是前者比后者多走了一步,重定向，顯然多多少少浪費(fèi)了一定的時間。所以以后我們加URL鏈接的時候，別忘了把最后的“/”給加上去。

12. Remove duplicate scripts 去除重復(fù)的腳本

這個其實(shí)沒有什么好說的，大家都應(yīng)該毫無條件的去遵守，但是越是明顯，越是簡單的事，我們往往會做不好，當(dāng)然，很多理由的，項(xiàng)目時間太緊張了等等，導(dǎo)致代碼很亂，很多重復(fù)的地方。其實(shí)誰都知道重負(fù)不好，不過還好，我們的頁面重復(fù)的腳本代碼不多（至少一個頁面里面，呵呵）。不過，我到是希望，我們不僅要做到一個頁面腳本不重復(fù)，而且要做到N個頁面，腳本要重用。

13.Configure ETags 這個好像是服務(wù)器端配置的問題，我不太懂，也就不亂說了，怕把大家給誤導(dǎo)了。

總共13個，但是看了YAHOO的官方說明，好像還有一個AJAX CACHE(AJAX 緩存)。我倒是覺得這個很重要，隨著我們AJAX應(yīng)用的廣泛，AJAX 緩存這個概念一定要時刻在我們腦子中，AJAX是個好東西，但是重復(fù)的數(shù)據(jù)，無休止的向后臺申請，絕對是個錯誤（不僅是速度上還是對服務(wù)器壓力上來說），所以我們就要對我們已經(jīng)申請到的數(shù)據(jù)進(jìn)行緩存，當(dāng)?shù)?次用到的時候，就直接從緩存中取，不要在去訪問我們寶貴的服務(wù)器資源了。其實(shí)這個思想不僅僅適合AJAX，在所有有數(shù)據(jù)復(fù)用的應(yīng)用中都應(yīng)該考慮到。

YSLOW就分析到這里完畢了，或許有些地方分析的不是很正確，或許有人分析的比我更早，更好，但是這些的確是我從工作中去積累，發(fā)現(xiàn)的，并很多都實(shí)際應(yīng)用到工作中去了，順便說下，嘿嘿，LIST頁面進(jìn)行優(yōu)化后，在0.92版本的YSLOW評分將達(dá)到76分，甚至80分，相當(dāng)于0.8版本的90分以上。不過評分畢竟是評分，關(guān)鍵還是速度。

最新評論