2008年10月12日 星期日

Apache上設定過期時間

過期時間(expired time)指的是,在瀏覽器向web server請求頁面、圖片、JS的時候,web server除了將完整的資料傳回給瀏覽器之外,還有送Header(標頭)。然而,Css, JS, Image,這三項是最佔用瀏覽器頻寬、也是最佔用web server資源的東西然而,如果要使用者瀏覽起來更為順暢,設定過期時間是最佳的解法。(期它的PHP或HTML不建議設定)

過期時間通常是在web server上設定。以Apache來說,如果我要針對所有的圖片,就到該目錄下...

/home/www/my_project/image/
建立一個.htaccess檔
在裡面寫入

Header unset ETag
FileETag None


ExpiresActive On
ExpiresDefault "access plus 1 month"
ExpiresByType image/gif A2592000
ExpiresByType image/png A2592000
ExpiresByType image/jpg A2592000
ExpiresByType image/jpeg A2592000



這裡面的範例是30天
前面的ETag,是yslow說把它disable掉會比較快!


如果是Javascript的話,就加上 (10天)

ExpiresByType application/javascript A864000
ExpiresByType application/x-javascript A864000
ExpiresByType text/javascript A864000


如果有css的話,就加上 (30天)

ExpiresByType text/css A2592000


切記,設了之後,使用者的瀏覽器就會快取住!
以我個人的習慣來說,JS的 library是用external,而操作頁面的JS,就寫在頁面裡面。
如此以來,比較不會有寫好JS,但使用者端不會改變的情況。

然CSS,建議是在 style.css是結尾加上時間,比如說...
/css/style.css?20081010