更新したのに反映されない原因はコレ!キャッシュの仕組みと即解決できる裏技!

「ホームページを更新したのに、変更が反映されない!」

そんな経験はありませんか?実はわたし自身も少し前に、同じ状況に遭遇して原因を調べたところキャッシュが原因でした。笑

人には「それはキャッシュだよ」と言えるのに自分事になると、更新されない、、、と焦ってしまいますね。
今回はAIに更新されない、と聞いたところ、キャッシュが原因と回答いただきすぐ解決できました!

この記事では、キャッシュとは何か・なぜ反映されないのか、そして検証ツールを開くだけでキャッシュを自動でオフにできる便利な設定や、制作者なら知っておきたいテクニックもあわせてご紹介します。

目次

キャッシュとは?

キャッシュとは、一度読み込んだデータを一時的に保存しておく仕組みです。

次に同じページを開くときに、保存済みのデータを使って素早く表示できるようにするための機能で、ホームページの表示を高速化するために役立っています。

表示速度の面では非常に便利な仕組みですが、開発者にとっては更新したのにすぐ反映されないというモヤモヤの種になったりもする厄介な仕組みです。。。

キャッシュは3種類ある

キャッシュには大きく3種類があります。これを理解しておくと、原因の特定がグッとしやすくなります。

① ブラウザキャッシュ(サイトを見る側)

ChromeやSafariなどのブラウザが、画像やCSSなどのデータを自分のパソコンやスマートフォンに保存しています。これがブラウザキャッシュです。
通常使ってるブラウザに標準装備されているキャッシュです。

自分のブラウザにキャッシュが残っているだけなので、キャッシュを消せばすぐに最新の表示に切り替わります
消し方は後ほど記載させていただきますね。

② プラグインキャッシュ(WordPress側)

WordPressを使っている場合、キャッシュ系のプラグインがキャッシュを保持していることがあります。W3 Total CacheやWP Super Cache、LiteSpeed Cacheなどがよく使われるプラグインです!

これらのプラグインはサイトの表示を高速化するためにページの内容を保存しておくので、更新後もプラグインのキャッシュが残っていると古い表示のままになることがあります。。。

プラグインのキャッシュをクリアするには、WordPressの管理画面上部に表示されているキャッシュプラグインのメニューから「キャッシュをクリア」もしくはやり方が分からなければ、一時的にプラグインを無効化してしまってもいいかと思います。

② サーバーキャッシュ(ホームページ側)

サーバー側でもキャッシュを保持する機能がありますが、これがとてもやっかいです、、、
サイトの後ろ側のキャッシュなので、ユーザー側がキャッシュをクリアしても反映されないことがあります。

ブラウザのキャッシュを削除したりWordPressのキャッシュプラグインを使っていない場合でも、レンタルサーバー側でキャッシュ機能が有効になっていると、更新が反映されないことがあります。

ブラウザのキャッシュを消す方法

スーパーリロードをする方法

一番よく知られている方法は「スーパーリロード」です!

ブラウザ上で検証画面(F12)を開いた状態で、更新ボタンを右クリックすると「キャッシュを消去してハード再読み込み」という選択肢が表示されます(Chromeの場合)。これをクリックするとブラウザキャッシュを無視して最新のページを読み込んでくれます。

開発者向け:検証ツールが便利

ホームページ制作の作業中は、毎回スーパーリロードをするのが手間に感じることもあります。そんなときは検証ツール(デベロッパーツール)の設定を使うのがオススメ!
一回設定すると自動的にキャッシュクリアされるので、この方法を最初に知ったときは楽すぎて感動しました!

  1. F12キーもしくは右クリックの「検証」から検証ツールを開く(MacはCommand + Option + I)
  2. 上部のタブから「Network(ネットワーク)」を選ぶ
  3. Disable cache」にチェックを入れる

これだけで、検証ツールを開いている間はキャッシュが自動でオフになります。作業中はチェックを入れておくと、更新のたびにスーパーリロードする手間が省けてとても快適です。

このブラウザでのキャッシュを削除しても消えない場合は以下のプラグインもしくはサーバーのキャッシュクリアを試してみてください!

ブラウザのキャッシュクリアで反映されない場合

上記のブラウザのキャッシュクリアで反映されない場合はプラグインもしくはサーバーサイドを確認する必要があります。

プラグインのキャッシュクリア

キャッシュ機能のプラグインを使っている場合はこの可能性が高いです。(W3 Total CacheやWP Super Cache、LiteSpeed Cacheなど)

プラグインのキャッシュをクリアするには、各プラグインの説明を読んでキャッシュクリアの仕方を検索してみてください。
ただし手っ取り早いのは、プラグインの無効化です。開発中は邪魔になることが多いので、一旦無効化しておいて、開発が完了した段階有効にする方が毎回の手間を考えるといいかと思います

サーバーのキャッシュクリア

主要なレンタルサーバーには、デフォルトでキャッシュ機能が搭載されています。

ロリポップ!の場合「ロリポップ!アクセラレータ」という機能が用意されており、ドメイン単位でON/OFFできます。WordPressをインストールした際に自動で有効になっている場合があるので、反映されないときは管理画面から確認してみてくださいね。

ConoHa WINGの場合「コンテンツキャッシュ」という機能がデフォルトでONになっています。管理画面の「サイト管理 → 高速化 → キャッシュ」から確認・クリアができます。

WordPressのキャッシュプラグインを削除しても反映されない場合は、サーバー側のキャッシュが残っている可能性があります。プラグインだけでなく、サーバーのキャッシュも確認するようにしましょう。

まとめ

キャッシュは表示速度を上げるための便利な仕組みですが、更新が反映されないトラブルの原因になることもあります。「更新したのに変わらない」と感じたら、まずブラウザとサーバー両方のキャッシュを確認してみてください。

制作中は検証ツールのDisable cacheをオンにしておくと、余計な混乱が減ります。ぜひ活用してみてください!

よかったらシェアしてね!
  • URLをコピーしました!

この記事を書いた人

愛知県豊田市にて、コーディングをメインにホームページ制作をおこなっています。
ただデザインのままを形にするだけの実装・構築ではなく、強固な基盤を整えて、彩りと工夫を加えた、育てやすさを重要視しています。
依頼者、閲覧者、そしてサイトに関わるすべての人に愛されるサイトを目指し、事業への愛着やファンを増やすようなポジテイブな循環を生み出す。この想いを形にするために、私にできることを全力でお手伝いしたいと思っています。

目次