昨天對博客進行了各種優化，合併並壓縮了幾個 JS 文件，改變了擺放位置，又大肆優化了 css，希望無聊的同學幫忙看看速度是不是有一點點提升。
其實昨天本來是希望改變一下 JS 文件內容，添加點內容，做完之後順便進行了壓縮，又碰巧看到可以把幾個文件放一起，比如 xx-packed.js 這樣的。分別加載確實不太好。
然後看到了 BoKeam 同學的這篇：【 WordPress 速度提升之 CSS 和 JS 的合併壓縮】 。遂去 【這裏】 進行了檢查，這站提供了 YSlow 和 Page Speed 的測試和評分，並附加了詳細的説明 （當然是 E 文的） 。我起初的 YSlow 只有 C，覺得有點低。然後找到了本篇的主要內容：添加 Expires Headers 。
啥是 Expires Headers
我同時測試了幾個朋友的站點，發現很多在這個 Expires Headers 上的評分都是 0 。導致 YSlow 的得分很低。以下是介紹：
| Expires header，就是過期時間的 header 報文。這個文件過期時間，其實就是通過 header 報文來指定特定類型的文件在瀏覽器中的緩存時間。有些文件 （例如樣式表中調用的背景圖片和文章中調用的圖片） 其實在很長一段時間內我們都不會對它們有什麼改變，這類文件可以設置非常長的緩存時間，這樣瀏覽器以後就不需要再從服務器下載這些文件而直接從緩存中讀取，從而大大加速網站的載入速度。 |
首次登錄的話並不能看出來有什麼提升，但是當瀏覽子頁面或者再次瀏覽的時候，就會發現速度較之前有很大改觀，服務器不會重新抓圖片、 css 、 javascript 這樣不常常跟新的文件 （就是減少了 HTTP 請求次數） 。
如何添加 Expires Headers
【以下內容來自：Tips And Tricks HQ 】
如果你的服務器是 Apache，你可以用 ExpiresDefault 這樣的語句。直接添加在.htaccess 文件即可。比如
| ExpiresDefault "access plus 2 months" |
這個語句使用了相對時間，即從現在起到兩個月後過期。當然 years 、 months 、 weeks 、 days 、 hours 、 minutes 、 seconds 都可以使用。
你可以寫入.htaccess 文件中這樣的語句：
| #Expire Header ExpiresDefault "access plus 2 hours" |
或者
# Expire images header ExpiresActive On ExpiresDefault A0 ExpiresByType image/gif A2592000 ExpiresByType image/png A2592000 ExpiresByType image/jpg A2592000 ExpiresByType image/jpeg A2592000 ExpiresByType image/ico A2592000 ExpiresByType text/css A2592000 ExpiresByType text/javascript A2592000 |
注：A2592000 為 1 個月 （60*60*24*30=2592000）
移除 ETags
這個看了半天，似乎建議直接一鍋端，移除它可以減少 HTTP headers 的大小，據説這樣能讓站點表現更好。依然在.htaccess 文件中加入下面語句即可。
據説這些小技巧可以提升網站 20% 的加載速度，我的站好像從 3.4xs 秒加快到 3.0s 或者 2.xs 甚至 1.84s 。改變確實是有的。
速度提升，當然還有還有 CDN 的使用、 cookie-free domains 的加入，但是資金是問題；合併 css 、 javascript 、背景圖片等這些，有時間就做做吧，只要站點正常顯示就可以。
PS：也有插件 Autoptimize 可以自動添加 expires header 、壓縮 css，js，html，省去了手動操作。而且可以選擇 CDN 。不過插件的壞處就是不知道它到底改了哪兒，一旦出現問題就得停用一個甚至幾個插件，停下來仔細檢查，這也是我不常加插件的原因。