キャッシュを無視したPCブラウザリロード【スーパーリロード】

web制作の際、htmlファイルやスタイルシートを更新したのにブラウザで更新されない、、みたいなことってたまにありますよね。

これって、使っているwebブラウザのキャッシュ（閲覧履歴）が原因として絡んでいることがよくあります。

制作の仕事に関わっている人以外だと、日常生活ではまずキャッシュなんて気にしないだろうし、存在すら知らない人の方がきっと多いと思います。

クライアントさんへの報告や修正の確認をする際、更新されてないです～と言われ、『キャッシュを切ってみてください。』とご案内することが多々あります。

制作の仕事に携わらせていただいてますので、そういう時に解決方法を案内できるのは大きいなと感じることがあったので備忘録。

そもそもキャッシュってなんだ？

ここで刺すのは『ブラウザキャッシュ』になりますが、ブラウザ上でページを表示した時に表示されている画像やHTMLファイルなどのデータを一時的にローカル環境に記憶(保存)しておく機能を指します。

次に同じページにアクセスした際にサーバーからデータを1からダウンロードして表示させるのではなく、一度保存しておいたデータを参照するため、前回よりも速く表示することができる機能ですね。

じゃあスーパーリロードは？

ブラウザのキャッシュ（閲覧履歴）は残したまま、強制的にwebサーバーから取得する方法を指します。

（ブラウザキャッシュを無視してのリロードというイメージです。）

通常の更新（リロード）で更新が確認できない場合は、こちらを使用して確認するとほぼ確実に正常に確認できます。

※シークレットモード

モダンwebブラウザにはシークレットモード（プライベートモード）という機能が実装されています。

この機能はキャッシュが残らない仕様になっているため、常に最新のデータを取得してくれるので制作・開発に最適とも言えますが、通常のモードとは分離されるためウィンドウが増えたり、登録している拡張機能が使えなかったりするので、場合に応じて使い分けるのがいいいと思います。

各PCブラウザのスーパーリロード ショートカット一覧

Google chrome

Mac

⌘Command + Shift + R

Win

Ctrl + Shift + R / Ctrl + F5

FireFox

Mac

 ⌘Command + Shift + R

Win

Ctrl + Shift + R / Ctrl + F5

Internet Explorer

Win

Ctrl + F5

Microsoft Edge

Win

Ctrl + F5

Safari

Mac

(先にキャッシュを空にします)
⌘Command + option + E
↓
(そのあとリロード)
⌘Command +  R

Win

Ctrl  + Shift + R / Shift + F5

ではまた。