ルール3 Expiresヘッダを使う
- Expiredをつけとくと、if-modifiedでチェックされる。
- サーバにリクエストもされない。それはリクエストヘッダがブラウザで止まってレスポンスを返してる状態のことを言う。
- だからリクエスト、レスポンス自体は見える。だけどブラウザだけローカルだけで終わってるってこと。
max-ageとmod_expire
- Cache Controlヘッダの導入 max-ageで指定。max-ageの場合は秒数で指定。
- 10年を指定
Cache-Controll: max-age=315360000
- apacheのmod_expiresをセットするとexpired, max-ageが同時に指定されることになる
<FileMatch "/.(gif|jpg|js|css)$"> ExpiresDefault "access plus 10 year2" </FileMatch>
キャッシュの有無
- ブラウザキャッシュがある状態で1日1回サイトにやってきた一意なユーザーは40〜60%をしめる。
- ブラウザキャッシュがある状態でページ参照回数は75%〜80%になる。
- つまりはユーザはブラウザキャッシュが空の状態で一度はくるけどあとはキャッシュありでずっと参照してる。
- ブラウザキャッシュがあるときに操作の最適化することが重要。
ファイル名にはバージョンを付加する
- js, cssにはバージョン名をつけて管理することでExpiresありでも、最新に反映をすることができる。そうすると容易な変更はできないけどね。正論です。
ブラウザの仕様
- F5を押下⇒サーバに取りにいくよってこと
- 『最新の画面に更新する』になる。つまり、サーバにデータを確認しに行っちゃうのです。
- Ctrl+F5⇒サーバにno-cacheで取りにいくよってこと
- サーバ側のキャッシュさえも無視するようのno-cacheをヘッダーに入れて送る。
- ただ画面遷移でその画面に戻ってくる
- これがExpiresが有効になるとき。ウチのサイトExpiresをレスポンスで返してないのにExpiresが有効になってるのはなぜ。。
- no-cacheしたときのうちの画像読み込みのレスポンス。
- via: jaguarってとこでCache-Control: max-age=604800をしてるみたいだ。これがブロードメディアのキャッシュだね。
- つことはどーやらウチのサイトはCDNもExpiresもやってるってことだなー。
--リクエスト Host: img.hmv.co.jp User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; ja; rv:1.9.0.10) Gecko/2009042316 Firefox/3.0.10 Accept: image/png,image/*;q=0.8,*/*;q=0.5 Accept-Language: ja,en-us;q=0.7,en;q=0.3 Accept-Encoding: gzip,deflate Accept-Charset: Shift_JIS,utf-8;q=0.7,*;q=0.7 Keep-Alive: 300 Proxy-Connection: keep-alive Referer: http://www.hmv.co.jp/ Cookie: __utma=2072488.1110706380.1202643470.1242489589.1242493822.119; __utmz=2072488.1234352223.103.1.utmccn=(direct)|utmcsr=(direct)|utmcmd=(none); __utmc=2072488; __utmb=2072488 Pragma: no-cache Cache-Control: no-cache --レスポンス Date: Sat, 16 May 2009 17:25:24 GMT Cache-Control: max-age=604800 Content-Length: 2399 Content-Type: image/gif Last-Modified: Tue, 07 Apr 2009 09:47:04 GMT Accept-Ranges: bytes Etag: "e624b6ce65b7c91:263" Server: Microsoft-IIS/6.0 nnCoection: close Via: 1.1 jpcnw3slh013 (Jaguar/3.0-62) Age: 0