Yahoo 給出的34條網(wǎng)站加速方法Yahoo 給出的包括Yslow 規(guī)則（22條）的34條 ，通過這此規(guī)則對自己頁面進(jìn)行一次全面的分析優(yōu)化，可以提高你網(wǎng)站的加載速度。 1.Minimize HTT

Yahoo 給出的34條網(wǎng)站加速方法

Yahoo 給出的包括Yslow 規(guī)則（22條）的34條 ，通過這此規(guī)則對自己頁面進(jìn)行一次全面的分析優(yōu)化，可以提高你網(wǎng)站的加載速度。 1.Minimize HTTP Requests 減少HTTP 請求

圖片、CSS 、script 、flash 等等這些都會(huì)增加http 請求數(shù)，減少這些元素的數(shù)量就能減少響應(yīng)時(shí)間。把多個(gè)JS 、CSS 在可能的情況下寫進(jìn)一個(gè)文件，頁面里直接寫入圖片也是不好的做法，應(yīng)該寫進(jìn)CSS 里，利用 將小圖拼合后利用background 來定位。

2.Use a Content Delivery Network 利用CDN 技術(shù)

CDN 確實(shí)是好東西，8過服務(wù)器提供商的這項(xiàng)服務(wù)一般是要收費(fèi)的，我以前買的國內(nèi)空間是有這個(gè)的但是我當(dāng)時(shí)根本不知道啥用，現(xiàn)在沒了。。。

3.Add an Expires or a Cache-Control Header 設(shè)置頭文件過期或者靜態(tài)緩存 瀏覽器會(huì)用緩存來減少http 請求數(shù)來加快頁面加載的時(shí)間，如果頁面頭部加一個(gè)很長的過期時(shí)間，瀏覽器就會(huì)一直緩存頁面里的元素。不過這樣如果頁面里的東西變動(dòng)的話就要改名字了，否則用戶端不會(huì)主動(dòng)刷新，看自己衡量了~ 這項(xiàng)可以通過修改.htaccess 文件來實(shí)現(xiàn)。

4.Gzip Components Gzip壓縮

Gzip 格式是一種很普遍的壓縮技術(shù)，幾乎所有的瀏覽器都有解壓Gzip 格式的能力，而且它可以壓縮的比例非常大，一般壓縮率為85。壓縮沒壓縮，可以到 這里 做下測試。

5.Put Stylesheets at the Top 把CSS 放頂部

讓瀏覽者能盡早的看到網(wǎng)站的完整樣式。

6.Put Scripts at the Bottom 把JS 放底部

網(wǎng)站呈現(xiàn)完畢后再進(jìn)行功能設(shè)置，當(dāng)然這些JS 要在你的加載過程中不影響內(nèi)容表現(xiàn)。

7.Avoid CSS Expressions 避免CSS Expressions

CSS 表達(dá)式很可怕，這個(gè)只被IE 支持的東西執(zhí)行時(shí)候的運(yùn)算量非常大，你移動(dòng)一下鼠標(biāo)它都要進(jìn)行重計(jì)算的，但有時(shí)候?yàn)榱俗鰹g覽器的兼容必須要用到這個(gè)||| IE6去死去死！~

8.Make JavaScript and CSS External 將JS 和CSS 外鏈

前面講到了緩存這個(gè)事情，一些較為公用的JS 和CSS ，我們可以使用外鏈的形式，譬如我就是從Google 外鏈來的Jquery 文件，如果我的瀏覽者在瀏覽別的使用了這個(gè)外鏈文件的網(wǎng)站時(shí)已經(jīng)下載并緩存了這個(gè)文件，那么他在瀏覽我的網(wǎng)站的時(shí)候就不需要再進(jìn)行下載了！~

使用托管在Google 的JavaScript 庫，這是目前富頁面設(shè)計(jì)中比較常用的方法，也是未來web 前端設(shè)計(jì)的趨勢。

因?yàn)镴avaScript 設(shè)計(jì)復(fù)雜，而使用通用JavaScript 庫的話，可以簡化設(shè)計(jì)，并且統(tǒng)一風(fēng)格，并且設(shè)計(jì)良好的JavaScript 庫有良好的擴(kuò)展性以增加功能。

但目前一般的JavaScript 庫體積都在100K 上下，對于目前的網(wǎng)絡(luò)來說還是比較大了，為了加快網(wǎng)頁載入，減少http 請求數(shù)，使用公共JavaScript 庫是必要的——事實(shí)上未來可能將

JavaScript 庫存儲于瀏覽器端，這將進(jìn)一步加快網(wǎng)頁的載入速度。

所以這沒有什么違不違法，也跟道德沒關(guān)系。

至于css 框架，目前雖然有一些，不過遠(yuǎn)不像JavaScript 庫那樣完善，目前還很少看到有css 外鏈的

9.Reduce DNS Lookups 減少DNS 查找

貌似是要減少網(wǎng)站從外部調(diào)用資源，我的Google 分析和picasa 的外鏈圖片都算在里面了。

10.Minify JavaScript and CSS 減小JS 和CSS 的體積

寫JS 和CSS 都是有技巧的，用最少的代碼實(shí)現(xiàn)同樣的功能，減少空白，增強(qiáng)邏輯性，用縮寫方式等等，當(dāng)然也有不少工具也能夠幫你實(shí)現(xiàn)這一點(diǎn)。

11. Avoid Redirects 避免重定向

再寫入鏈接時(shí)，雖然“http://www. today-s-ooxx. com”和“http://www. today-s-ooxx. com/” 僅有一個(gè)最后的“/”只差，但是結(jié)果是不同的，服務(wù)器需要花時(shí)間把前者重定向?yàn)楹笳呷缓筮M(jìn)行跳轉(zhuǎn)，這個(gè)要自己注意，也可以在Apache 里用Alias 或者mod_rewrite或者DirectorySlash 解決。

重定向結(jié)束于301或302狀態(tài)碼。這里有一個(gè)302響應(yīng)的HTTP 頭的例子：

這里有一個(gè)301響應(yīng)的HTTP 頭的例子：

HTTP/1.1 301 Moved Permanently

Location: http://example.com/newuri

Content-Type: text/html

瀏覽器會(huì)自動(dòng)把用戶轉(zhuǎn)向Location 域中指明的Url 地址。HTTP 頭里包含了重定向所需的所有信息。響應(yīng)的主體一般是空的。301或者302響應(yīng)都不會(huì)被實(shí)際緩存，除非添加額外的頭部，比如 Expires或者Cache-Control 指明了它應(yīng)該被緩存。meta refresh標(biāo)簽和

JavaScript 也可以將用戶重定向到不同的URL ，但如果你必須執(zhí)行重定向，最好的方法是使用標(biāo)準(zhǔn)的3XX HTTP狀態(tài)代碼，以便使后退按鈕工作正常。

需要謹(jǐn)記的是，重定向降低了用戶體驗(yàn)。在用戶和HTML 文檔之間插入的重定向延誤了頁面的呈現(xiàn)和組件下載，因?yàn)樗鼈兌疾豢赡茉讷@得HTML 文檔之前開始。

一種最浪費(fèi)性能的重定向頻繁發(fā)生而網(wǎng)絡(luò)開發(fā)者們卻往往沒有意識到，那就是當(dāng)?shù)刂分袘?yīng)當(dāng)有一個(gè)左斜線（/）卻沒有的時(shí)候。比如，訪問http://astrology.yahoo.com/astrology會(huì)導(dǎo)致一個(gè)301效應(yīng)并重定向到http://astrology.yahoo.com/astrology/（注意這里加了一個(gè)左斜線）。在Apache 中，這可以使用mod_rewrite,或者在Apache 事件處理中使用DirectorySlash 指令來修補(bǔ)。

使用重定向的另一個(gè)常見場景是連接舊網(wǎng)站和新網(wǎng)站。還包括連接網(wǎng)站的不同部分，或者在不同情況下 （比如依據(jù)瀏覽器的類型，用戶的類型等）重定向用戶。使用重定向來連接兩個(gè)網(wǎng)站很簡單而且需要很少的額外代碼。雖然在這些情況下使用重定向減少了開發(fā)者的 麻煩，但卻降低了用戶體驗(yàn)。如果兩部分在同一個(gè)服務(wù)器上，可以使用Alias 和rewrite 來替代重定向。如果域名變更引起了重定向，可以創(chuàng)建一個(gè)CNAME （一種可以創(chuàng)建一個(gè)別名使一個(gè)域名指向另一個(gè)的DNS 記錄）結(jié)合 Alias 或者mod_rewrite來替代重定向

12. Remove Duplicate Scripts 刪除重復(fù)腳本

重復(fù)調(diào)用的代碼瀏覽器并不會(huì)識別忽略，而是會(huì)再次運(yùn)算一遍，這當(dāng)然是大大的浪費(fèi)。

13. Configure ETags 配置ETags

搞不清楚咋回事，總之我是在. htaccess里把它刪除了。

14. Make Ajax Cacheable 緩存Ajax

Ajax 是實(shí)時(shí)響應(yīng)的，在瀏覽器接收到新的數(shù)據(jù)前，舊的數(shù)據(jù)被緩存，這樣能夠更好的提高效率。

15. Flush the Buffer Early 盡早的釋放緩沖

當(dāng)用戶進(jìn)行頁面請求時(shí)，服務(wù)器端需要花費(fèi)200到500毫秒時(shí)間來拼合HTML ，將寫在head 與body 之間，釋放緩沖，這樣可以將文件頭先發(fā)送出去，然后再發(fā)送文件內(nèi)容，提高效率。

16. Use GET for AJAX Requests 用GET 方式進(jìn)行AJAX 請求

Get 方法和服務(wù)器只有一次交互（發(fā)送數(shù)據(jù)），而 Post 要兩次（發(fā)送頭部再發(fā)送數(shù)據(jù)）。

17. Post-load Components 延遲加載組件

最先加載必須的組件進(jìn)行頁面初始化，然后再加載其他，YUI Image Loader 是很好的例子。

18. Preload components 預(yù)加載組件

提前加載以后可能用到的東西，和延遲加載并不沖突，它的目的是為后續(xù)請求提供更快的響應(yīng)，參見Google 首頁上的CSS sprites應(yīng)用。

19. Reduce the Number of DOM Elements 減少DOM 元素?cái)?shù)量

復(fù)雜的頁面結(jié)構(gòu)意味著更長的下載及響應(yīng)時(shí)間，更合理更高效的使用標(biāo)簽來架構(gòu)頁面，是好的前端的必備條件。

20. Split Components Across Domains 跨域分離組件

頁面組件多個(gè)來源可以增大你的平行下載量，但注意不要過多，超過2-4個(gè)域名會(huì)引起上面說到的DNS 查找浪費(fèi)。

21. Minimize the Number of iframes 減少iframe 數(shù)量

需要更有效的利用 ifames 。

iframe 優(yōu)點(diǎn)：有利于下載緩慢的廣告等第三方內(nèi)容，安全沙箱，并行下載腳本 iframe 缺點(diǎn)：即使為空也會(huì)有較大資源消耗，會(huì)阻止頁面的onload ，非語義

22. No 404s 不要出現(xiàn)404頁面

站點(diǎn)本身里（非搜索結(jié)果）出現(xiàn)404頁面，無意義的404頁面會(huì)影響用戶體驗(yàn)并且會(huì)消耗服務(wù)器資源。

23. Reduce Cookie Size 減小Cookie

Cookie 在服務(wù)器及瀏覽器之間的通過文件頭進(jìn)行交換，盡可能減小Cookie 體積，設(shè)置合理的過期時(shí)間，能夠很好的提高效率。

24. Use Cookie-free Domains for Components 對組件使用無Cookie 的域名

對靜態(tài)組件的Cookie 讀取是一種浪費(fèi)，使用另一個(gè)無Cookie 的域名來存放你的靜態(tài)組件式一個(gè)好方法，或者也可以在Cookie 中只存放帶www 的域名。

25. Minimize DOM Access 減少DOM 的訪問次數(shù)

JS 訪問DOM 是很慢的，盡量不要用JS 來設(shè)置頁面布局。

26. Develop Smart Event Handlers 開發(fā)靈活的事件處理句柄

DOM 樹上過多的元素被加入事件句柄的話，反應(yīng)效率肯定會(huì)低，YUI 事件工具有一個(gè) onAvailable 方法可以幫助你靈活的設(shè)置DOM 事件句柄 27. Choose < link >over @import 使用< link >而非 @import

在IE 中使用@import就和在頁面底部用< link >一樣，我們前面說要把< link >放頂部的。

28. Avoid Filters 避免過濾器的使用

如果需要Alpha 透明，不要使用AlphaImageLoader ，它效率低下而且只對IE6及以下的版本適用，用PNG8圖片。如果你非要使用，加上_filter以免影響IE7 用戶。 29. Optimize Images 優(yōu)化圖片

將你的GIF 轉(zhuǎn)為PNG8會(huì)是個(gè)減小體積的好辦法，另外有很多方法處理你的JPG 及PNG 圖片以達(dá)到優(yōu)化效果。

30. Optimize CSS Sprites 優(yōu)化CSS Sprites

在CSS Sprites中豎直并盡量緊湊的排列圖片，盡量將顏色相似的圖片排在一起，會(huì)減小圖片本身的大小及提高頁面圖片顯示速度。

31. Don’t Scale Images in HTML 不要在HTML 中縮放圖片

圖片要用多大的就用多大的，1000X1000的圖片被width=”100″ height=”100″以后，本身的KB 數(shù)是不會(huì)減少的。

32. Make favicon. ico Small and Cacheable 縮小favicon. ico的大小并緩存它

站點(diǎn)的瀏覽器ICO 應(yīng)該不是經(jīng)常換吧，那就長時(shí)間的緩存它，并且最好控制在1K 以下。

33. Keep Components under 25K 保證組件在25K 以下

iPhone 不能緩存25K 以上的組件，并且這還是要在被壓縮前。

34. Pack Components into a Multipart Document 將組件打包進(jìn)一個(gè)多部分的文檔中 就好像在郵件中加入附件一樣，一個(gè)HTTP 請求就夠了，但是這一技術(shù)需要確保你的代理支持，iPhone 就不支持