HTMLのキャッシュについて考える

開発や、サービス更新の時に、ページが崩れてしまう場合、「キャッシュのせいでページが崩れています」という事で、ブラウザのスーパーリロードを行ってもらう事がよくありますが、こういう自体にならないための方法を考えてみたい。

キャッシュをさせないための仕組みは簡単。

phpでhtml出力を制御しているのであれば、ファイルの後ろに年月日時分秒のクエリをつける事で1秒毎に新しいファイルアクセスができるようになる。 Javascriptでappendしている場合は、同じくファイル名にクエリを付ける方法で回避できるが、ベタにタグが書かれている場合はキャッシュが読み込まれてしまうので要注意だ。

キャッシュは何故存在するのか？

実はキャッシュはサーバーアクセスを軽減させるいい手段である。 キャッシュを有効にしていれば、サーバーアクセスが膨大になっても、ローカルにキャッシュされているモジュールを使ってページ表示ができるので、サーバー負荷は必要最低限に抑えられます。 こんな便利な機能を、大体のサービスページでは、no-cacheという手段でキャッシュさせないような仕組みにしています。

キャッシュをクリアする事

各種ブラウザ側でページ更新などを行う事でキャッシュのクリアをすることはできますが、WEBサービスに関してであれば、それを仕様にすることは有り得ないでしょう。 そして、キャッシュさせない仕組みをサービスに搭載するのもアリですが、やはりキャッシュをONにしている状態であれば、モバイル端末を利用しているのであれば、ユーザー側としては、通信量の削減にもつながるので、できればサイト運営者の人はこうしたポリシーを念頭に置いておくべきだと思われます。

キャッシュするべきとそうでないリクエストを分けて考える

都度のアクセスで動的に変更されるコンテンツモジュールなどは、キャッシュすべきではありません。 ただし、画像ファイルなど、ファイル名が固定で変更されないものに関しては、キャッシュするべきコンテンツです。 Jsvascriptやcssなどは、ページ更新の時に変更する可能性が高いコンテンツですが、考え方としては、全ての読み込みモジュールを一括でクエリ対応するのは、サイト全体のバージョン管理をするようなケースです。 個別のモジュール毎にバージョン管理を行うことも不可能ではないですが、PHPなどCMSシステムで行うのが望ましいでしょう。 また、外部APIなどの運用の場合は、バージョン管理のクッションを設置し、キャッシュを利用するのかどうかを判別するシステムを用意するのもいいでしょう。

HTMLソースのタグは簡単には変更できない

個人で運用しているようなWEBページであれば、気軽にソースコードを変更することは可能ですが、企業が公開しているようなWEBサイトではそうもいきません。 大手企業などは、タグを１つ貼り付けるのに100万円ぐらいの経費が掛かるという事を聞き、何故かと聞いてみたところ、タグの張り替えは、WEBサイトというシステム変更になり、システム変更は外部のベンダーに全て一任しているとのこと。もちろんベンダーもぼったくっているわけではなく、システム変更に伴う、関連ページの検証、確認などを行う必要もあり、確実に膨大な工数が発生するとのことです。 こういう現状を考えると、タグを利用するサービス運営をしている会社は、キャッシュに対してきちんと仕組みを持っておかなければいけませんね。

ベストなキャッシュ状態は？

更新したタイミングでキャッシュをクリアしてくれるのが一番いい方法なのだが、どうすればそういうシステムを組めるのか？ 1. バージョン管理を行って、システムに更新がされた場合にカウントアップを行い、その文字列をPHPやjavascriptでクエリを付ける。 2. 更新タイミングが一定でなく、細かなバージョン管理ができる開発体制では無い場合は、キャッシュレスの状態にする。
全ての読み込みモジュールに対して、リアルタイムなタイムスタンプクエリを付与する。 3. 更新されたファイルは、ファイル名を変更していく。
この際にファイル名はバージョン番号を追加した状態にすると管理しやすいかも。
ただし、ゴミファイルが増大するので、未使用ファイルの管理をしっかりしなければいけない。

あとがき

だいたい思いつく対策はこんな感じだが、HTMLのmetaタグに記述する”no-cache”などは、ほとんど機能しないと思った方がいい。 また、質問サイトでどうやってもキャッシュがクリアできないという場合は、apacheなどの設定というオチもあるので、しっかり確認してみるのがいいでしょう。