この記事ではWebサイトで使われるキャッシュに触れていきたいと思います。
Webサイトを運営するにあたっての悩みと言えば、一二を争っているのが高速化についてだと思います。
高速化について誰でも簡単に出来ることと言えば、画像の容量をできる限り減らした物を使うことでしょう。
画像サイズを大きいままで使っていないこと、そして拡張子をWebPに変換して扱っていることでしょうか。
これらは無料ブログサービスでも出来ることですね。
その他を上げるとするならば、構造の整頓は出来ているか、ですかね。これはHTMLやCSSの書き方や、書く量のことを指してます。
WordPressではどうでしょうか。自分はWordPressの高速化などを調べているとこんな言葉をよく見かけます。
「キャッシュを全てオンにしてください」
今回は、高速化の話でよく出てくる「キャッシュ」という言葉について、安易にすべてオンにする前に知っておきたい仕組みを、WordPress初心者の方に向けて整理していきます。
キャッシュという便利な言葉の種類
一言でキャッシュと言っても、それぞれに役割があります。ちなみにキャッシュとは英語表記では「cache」です。何かしらの事情でデータの中身を見る機会があった時に、この言葉を見つけたらキャッシュデータだと思って間違いありません。
馴染みのない人には「cache=カチェ？」と思うかもしれませんが、それで良いです。カチェ=cache=キャッシュです。
覚え方なんで何でも良いので、それがキャッシュだと覚えてしまえば良いのですから。
ブラウザキャッシュ
ブラウザキャッシュという仕組みがあります。
目的としてはネット通信そのものを減らして表示させることでしょう。
ブラウザキャッシュは、画像やCSS、JavaScriptなどをブラウザ側に一時保存して、次に同じページを見るときの読み込みを軽くする仕組みです。
多くの場合、サーバー側の設定やHTTPヘッダーの情報をもとに保存されますが、見る側のブラウザに残るキャッシュなので、運営者側の更新と表示結果にズレが出ることがあります。
ブラウザには閲覧履歴データがあり、閲覧履歴データのキャッシュされた画像とファイルを削除するとブラウザのキャッシュクリアになります。
誤って「Cookieとその他のサイトデータ」まで削除しないように注意してください。多くのサイトでログイン状態が解除され、再ログインが必要になる場合があります。
1. デベロッパーツール
デベロッパーツールのネットワーク項目で、キャッシュを無効化の選択をした状態のWebサイトが、ブラウザキャッシュをオフにした状態となります。
サイト本来の実力値を測ることが出来ると言えるでしょう。
2. シークレットモード
シークレットモードとはキャッシュを持っていない状態でWebサイトを閲覧します。ゼロから始まり、ページ遷移を繰り返すたびにブラウザキャッシュを溜めていきますが、ウィンドウを閉じればシークレットモードで溜めたブラウザキャッシュは破棄します。
Webサイトで更新または修正内容が表示されないときがあると思います。
その状態でキャッシュを無効化の選択をしたデベロッパーツール、もしくはシークレットモード、この双方どちらかでWebサイトを確認してあるべき内容が表示された場合はブラウザキャッシュの影響下にあったと言えます。
基本、ブラウザキャッシュは個人で使うブラウザの影響下にあるので、このような場合は設定を気にする事はありません。他の方が見ても更新や修正内容は表示されますが、頻繁に利用するリピーターには影響があると言えます。
この場合、WordPressで使っているテーマのリセット機能があれば、実行しましょう。
誤ってデザインのリセットを実行しないように慣れていても慎重に行ってください。
コンテンツキャッシュ
コンテンツキャッシュは、使い方によって便利にもなりますが、更新内容がすぐに反映されない原因になることもあります。
そのため、「高速化＝コンテンツキャッシュをすべてオン」と考えるのではなく、サイトの更新頻度や運用方法に合わせて選ぶことが大切です。
1. コンテンツキャッシュがオフの場合
Webサイトの内容を一切キャッシュしません。毎回データをサーバーから取ってきます。
例えるならば、汗だくになりながら一生懸命に足を使ってサーバー間を行き来している状態です。頑張ってデータを持って来てくれているので、構造次第でWebサイトの表示が遅くなりますが、コンテンツキャッシュの影響下にない全ての更新内容が確実に反映されます。
2. ON（静的コンテンツのみ）
画像、CSS、JSをキャッシュします。記事の中身（HTML）は最新になりますが、デザイン（CSS）やツールの動き（JS）を修正したときに反映が遅れることがあります。
ここで注目するべき点は「画像、CSS、JSをキャッシュ」です。
3. ON（HTML/CSS/JS以外静的コンテンツのみ）
画像やフォントなどを中心にキャッシュします。記事（HTML）やデザイン（CSS）、動き（JavaScript）はキャッシュ対象から外れるため、更新内容を反映しやすくなります。
- サイトを頻繁に更新し、デザイン修正やツールの調整もできるだけ反映しやすくしたい人に向いています。
4. ON（すべてのコンテンツ）
すべて（HTMLも画像も全部）をキャッシュします。表示速度の面では有利になる場合がありますが、設定やキャッシュの有効期限によっては、記事を更新しても古い内容がしばらく表示されることがあります。
更新頻度が低く、表示速度を優先したいサイトでは選択肢になりますが、頻繁に記事やデザインを調整するサイトでは注意が必要です。
そのため、更新頻度が高いサイトでは「4. ON（すべてのコンテンツ）」を使う場合、反映確認の手間が増える可能性があります。
ただし、例外はあります。それはコンテンツキャッシュを意図的に壊す（パージする）制御を行っているケースです。そして、使い勝手が一番良かったのが次のケースになります。
コンテンツキャッシュのパージが「保存（更新）ボタン」がトリガーになる
テーマやプラグインのプログラム内に、「記事を保存・更新した瞬間に、そのページのキャッシュファイルをサーバーから削除する」という命令が組み込まれている場合があります。
- 仕組み: ユーザーが更新ボタンを押す → WordPressがデータベースを更新する → 同時に対象ページのキャッシュを削除する。
- 結果: 次にサイトを見た人は、キャッシュがないため「最新の状態」を生成し直すことになり、反映されたように見えます。
ブラウザキャッシュをクリアしても更新内容や修正内容が反映されない場合は、コンテンツキャッシュの設定を見直す必要があります。
もちろん、必要な場面でキャッシュをクリアすること自体は間違いではありません。
ただ、修正のたびに毎回手動でキャッシュを削除する運用になると、手間が増えたり、消し忘れによって古い表示が残ったりすることがあります。
そのため、できれば「毎回手動で消す」よりも、サイトの運用に合ったキャッシュ設定を選ぶ方が安定しやすいです。
1. 修正のたびに確認作業が増える
キャッシュを毎回手動で削除する運用にすると、記事の更新やデザイン修正のたびに「反映されたかどうか」を確認する手間が増えます。
- 注意点: 作業自体は難しくなくても、更新のたびに繰り返すと負担になりやすく、確認漏れの原因にもなります。
2. 一時的に表示が重くなることがある
キャッシュを削除した直後は、サイトがもう一度データを読み込み直したり、キャッシュを作り直したりする状態になります。
- 注意点: アクセスが多いタイミングでは、普段より表示が遅く感じられる場合があります。
3. 消し忘れや確認漏れが起きやすい
「修正したら必ずキャッシュを消す」というルールは、慣れているときほど忘れやすくなります。
- 注意点: 自分の環境では新しく見えていても、別の環境では古い表示が残るなど、確認がややこしくなることがあります。
安定して運営するために意識したいこと
できれば、修正のたびに手動でキャッシュを消すのではなく、運用に合ったキャッシュ設定を選ぶことを意識したいところです。
- キャッシュさせない場所を明確にする
「HTML/CSS/JS以外」という設定のように、頻繁に変わる部分は最初からキャッシュ対象外にすると、更新内容を確認しやすくなります。
そうは言っても、「コンテンツキャッシュを弱めると表示が遅くなるのでは」と不安になる気持ちも分かります。実際、キャッシュ設定だけで表示速度を整えようとすると、どこかで限界を感じることもあります。
その結果、検索で見つけたPHPコードをそのまま追加したり、よく分からないまま高速化系の設定を重ねたりして、かえって表示崩れやエラーにつながることもあります。
そこで選択肢のひとつになるのが、オブジェクトキャッシュです。
オブジェクトキャッシュとAPCu
ここ（ミコトホド）はConoHa WINGを使って動かしています。環境によって条件はありますが、APCuを活用できる場合は、WordPressがデータベースから取得した情報の一部を再利用しやすくなり、表示の負担を軽くできる可能性があります。
オブジェクトとは
記憶の断片です。WordPressがページを表示するために使う、設定情報や記事情報などの「データの部品」のようなものだと考えると分かりやすいです。
なぜ「記憶の断片」なのか
WordPressが1つのページを表示するには、以下のような「小さな情報」を大量に集める必要があります。
- サイトの名前は何？
- この記事のカテゴリーは何？
- この記事の公開日は？
- サイドバーのウィジェットに何を表示する？
- カスタマイズ設定（色やフォント）はどうなってる？
これらは通常、データベースの中に「文字」としてバラバラに保管されています。
格納されるプロセス
- 回収: 誰かがページを見たとき、PHPがデータベースからこれらの「断片」をかき集めます。
- 整理: かき集めた断片を、PHPが扱いやすい「オブジェクト（データの塊）」という形にまとめます。
- 格納: 次に同じ部品が必要になったとき、またデータベースへ探しに行く手間を減らすため、その整理した「断片」をAPCu（メモリ）に一時保存しておきます。
「ページ全体」という完成品を保存するのがコンテンツキャッシュ。
ページを作るための「記憶の断片」を保存するのがオブジェクトキャッシュです。
オブジェクトキャッシュを使った運営の強み
「断片」を再利用する仕組みなので、ページ全体を丸ごと保存するコンテンツキャッシュと比べると、記事本文の更新と表示結果がズレにくいのが扱いやすい点です。
APCuはどこに保存される？
APCuのキャッシュデータは、サーバーのメインメモリ（RAM）上に保存されます。
- 保存される場所: HDDやSSDのようなストレージではなく、サーバーのメモリ上に一時的に保存されます。
- 特徴: ストレージより高速に読み書きできますが、サーバーの再起動やPHPのリセットなどで中身が消えることがあります。
APCuを使うにあたって便利なプラグインがあります。
それがAPCu Managerです。このプラグインについては、別の記事で実際に使ってみた記録をまとめています。
APCu Managerを使ってみた記録｜WordPressのオブジェクトキャッシュ運用メモ
まとめ｜キャッシュは種類を理解して使い分ける
キャッシュの設定は、すべてをオンにすれば良いというものではありません。サイトの更新頻度や運用方法によって、合う設定は変わります。
ブラウザキャッシュやオブジェクトキャッシュは活用しやすい一方で、コンテンツキャッシュは更新内容の反映に影響しやすいため、特に設定を見直したい部分です。
ちなみにここではON（HTML/CSS/JS以外静的コンテンツのみ）を使用しています。
その他としてはテーマでの設定でしょうか。サイドバーをキャッシュし下部エリアを遅延させています。
ここまでが、初心者の方でも比較的扱いやすく、Webサイトの表示を管理しやすいキャッシュ設定だと感じています。ミコトホドでは現状、この設定で更新の反映と表示速度のバランスを取っています。
今後、サイトに負荷がかかる機能を追加する場合も、まずはコンテンツキャッシュを強めるのではなく、オブジェクトキャッシュを含めた負担の減らし方を見直していくつもりです。
自身のWebサイトではどのキャッシュが使われているのか、更新内容が反映されやすい設定になっているのか、一度見直してみるのも良いかもしれません。
コメント