備忘録的な側面が強いですが、WordPressの中でも特にややこしいキャッシュ系の高速化機能についていい加減ちゃんとしておこうと思ってまとめました。
メインの対象は
- エックスサーバーを使っている人
- Cocoonを使っている人
のどちらにも当てはまる場合を考えてますが、キャッシュプラグインなどについてもまとめるのでどなたにでも少しは役に立つと思います。もちろんどちらか片方だけの方もどうぞ。
関連する言葉の意味やサービス、機能の概要については一通り知っていることを前提とします。面倒臭いんでそういう説明はカット！
関係ありそうなページはまとめてリンク貼っておくので適宜ご利用くだされ。
- WordPressキャッシュプラグインを選ぶために知っておくべきこと
※これは一度読んでおいた方がいいです。おすすめ。 - 効果が高いキャッシュ・高速化のWordPressプラグイン徹底比較、おすすめはどれ！？
※脳死でW3 Total CacheやWP Super Cacheを使っている人は一見の価値あり。 - Xアクセラレータ
- サーバーキャッシュ設定
- ブラウザキャッシュ設定
- 「Xアクセラレータ」機能提供開始のお知らせ（2018/9/11）
- 「Xアクセラレータ Ver.2」機能提供のお知らせ（2019/2/20）
- Cocoon サイト高速化設定
今回まとめるに至るきっかけ
サーバー移行を検討し始めたのがスタートでした。
このブログはもともと スターサーバー 
で運営していたんですが、色々ありエックスサーバー
に移転することとなったんです。
もともとエックスサーバーで運営しているサイトは別で持っていたので、その同じアカウントにお引っ越しする感じ。容量もスカスカでドメインの管理もバッチリできているのでその辺は問題ありませんでした。
で、いざサーバーを移転するとなると本題のデータやらWordPressの引っ越しなんかよりも、キャッシュ系機能などについての諸々の方が遥かに面倒なことにすぐ気が付きました。
- 「W3 Total Cache」は削除するだけで不具合が出る、真っ白になる、原因も不明、復旧も難しい、とかある。そもそも移行の場合はどうなるの…？
- エックスサーバーにはたくさん高速化機能があるけど、それとキャッシュ系プラグインの併用状況は？
- そういやCocoonにも高速化機能あるけど…？
みたいになっちゃったんで、一回整理というわけです。
まずやりたいこと
「やりたいこと」ですが、僕が今の状況でのやりたいことをまとめても多くの人には需要がないであろうと思い、なるべく一般化してリストにします。「知りたいこと」に近いかな？
キャッシュプラグインはどれがいい？
よく分からず使っていたけど、キャッシュプラグインってどういう仕組みで、何に対してどういう動作をしているの？
エックスサーバーの高速化機能、意味不明なんだけど？
ただでさえ機能数が多くてややこしいのに、アップデートとかでしょっちゅう中身が変わったり名称が変わったりしていたらしいので、その辺をまとめよう。
キャッシュの種類ごとにどのツールを使うか決めたい
例えばブラウザキャッシュはエックスサーバーにもCocoonにもプラグインにもあるけど、どれをどう使うのがベスト？
最もメンテが楽で余計な不都合にも見舞われないベストな環境は？
最終的にここに落ち着きたい。使うものの数を少なくして、かつ仕様変更なども頻度が少ないものを選ぶ。あまり効果がないものは使うのをやめて保守性を重視する。
これですっきり
もちろん各々の効果がちゃんと速度（もしくはなんらかのスコア等）で体感できることは前提です。よく分からんものはいい機会なのでbye-byeしたいという目論見もあります。
情報の整理
というわけでさっそく情報の整理。
ちょっと体系的にまとめるのが難しそうなので、ここはやっぱり「僕がやったこと」をベースに見出しにしてます。
キャッシュ系機能についてのまとめは最後に表にしたので飛ばしたい方はこちらから。
W3 Total Cacheの削除
これは全く問題ありませんでした。
そもそももう使うのをやめたい意志のほうが遥かに強かったので、移行がどうとかではなく即刻削除。
以下のようなサイトを参考にすれば特に不具合なく完了する。
キャッシュプラグインはどうするべきか？
恥ずかしながら今までちゃんと理解しようとしていなかったのだけど、どうやらWordPressのキャッシュには主に４種類があるらしい。
- ブラウザ・キャッシュ
- ページ・キャッシュ
- データベース・キャッシュ
- オブジェクト・キャッシュ
という感じ。
（もともとこのそれぞれについても書こうと思ってましたが、それは先人たちの記事のほうが遥かに詳しいし、この記事が煩雑になってしまうので今回は割愛することとします。これとかが参考になります）
エックスサーバーが独自に持つ「サーバー・キャッシュ」という機能はこの括りには入れず後述します。
で、W3 Total Cacheはというと全てに対応しています。
このサポートの広さがよく槍玉としてあげられる所以じゃないかと僕は思っていて、とにかく適切なところに適切な機能をあてがうというのが一番大事なんじゃないかと今では思ってます（実際、例えば同じ「ブラウザ・キャッシュ」のはずなのに体感効果はものによって違ったりする）。
検討を優先する順番も上に上げたとおりの優先順位にするべきで、特に
- データベース・キャッシュ
- オブジェクト・キャッシュ
は効果も体感しにくい上に色んなところで不都合が起きる可能性が高いです。
例えばW3 Total Cacheはどちらもサポートしてくれるけど、このプラグインを使うことによって起きた何らかの問題はほぼ全てこの「データベース・キャッシュ」と「オブジェクト・キャッシュ」が原因でした（僕調べ）。
「CSSが更新されない」など初心者がよく陥るキャッシュ系の代表的問題は「ページ・キャッシュ」に起因していることが多いですが、そこはクリアできているという前提です。
今回は色んなしがらみから脱するために
|
W3 Total Cacheを使うのをやめる |
というのは前提として絶対なので、それぞれのキャッシュを代わりに用意してやる必要があります。
| ブラウザ・キャッシュ | エックスサーバーとCocoon、どちらにもある（WP Fastest Cacheにもある、後述） |
| ページ・キャッシュ | 現状対応できるものはない→効果も大きいし、新しいプラグインを探す必要がある |
| データベース・キャッシュ | データベース・キャッシュはオブジェクト・キャッシュで代替できるというか、「データベース・キャッシュでキャッシュされるものはオブジェクト・キャッシュでキャッシュされるものに結構含んでいるらしい」ので、ここはあまり躍起になる必要はないと判断。 |
| オブジェクト・キャッシュ | とは言うものの、プラグインを使わざるを得ない上に問題も多いし効果も分かりにくいということで、今回以降ここの採用は見送り。 |
というわけで次からここを１つずつ見つつ、引き続き情報整理です。
なお、前提として同じ動作をするキャッシュを２つ以上有効化するのは絶対にやめた方がいいです。原因特定できない様々な問題を引き起こす可能性が一気に上がります。なので１つずつ選択していく必要があるというわけです。
ブラウザ・キャッシュ
ブラウザ・キャッシュは
- エックスサーバー
- Cocoon
それぞれに該当する機能がある。
画像を見てもらうと分かるんですが、Cocoonの方がちょっと情報が少ないです。高速化機能に関するページを見てもあまり詳細は書いてありません。
だからというわけでは全くないんですが、ここはなんとなくでエックスサーバーを選択しています。
設定内容ですが、
ONの中でも2種類あります。
- CSSとJavaScriptもキャッシュする
- CSSとJavaScriptはキャッシュしない
の違いだけです。ここは意外で、デフォルトの推奨設定は後者だろうと思っていたんですが今は違うみたいですね。ここは深く考えず推奨設定のままONにして良いと思います。
データを取ってもバラつきが多くてよく分からないのが正直なところですが、エックスサーバーのブラウザ・キャッシュの方が心持ち数値も良い気はしました。このサイトでは逆の言及がされてたけど…。まあ大差ないでしょう。
というわけでブラウザ・キャッシュはエックスサーバーの機能を採用。
この次に登場する「WP Fastest Cache」にもブラウザ・キャッシュの機能があったんですが、なるべくプラグインへの依存は減らしたい（テーマやサーバーなど純正寄りなものを使いたい）意図から実験すらしてません。
ページ・キャッシュ
お次はページ・キャッシュ。ここも効果がでかいので必ず導入したいところ。
現状の環境（エックスサーバーとCocoon）ではページ・キャッシュをサポートしてくれるものが存在しないので、ここだけは外部のプラグインに頼る必要があります。使うのはWP Fastest Cache。
W3 Total Cacheについて調べていたくらいからしょっちゅう目にするプラグインで、どうやら
- つくりがシンプル
- 問題が起きにくい
- 効果も高い
など、評価がかなり高い様子。ページ・キャッシュのみの使用も問題なく可能ということも分かったので、満を持して導入。また無効化で問題が出たりすると嫌なのでかなり慎重に作業しました。
設定内容については、例によって深くは掘り下げませんがざっとは紹介しておきます。参考にしたサイトはここなど（Cocoon用にぶつからないような設定が紹介されているのでおすすめ）。
効果はというと、確かに速くなった気はします。
パッとしない表現ですが、キャッシュ系機能で与れる恩恵は、僕ら人間がいつもの自分の環境でF5を押したところで分かるような効果ではないと思ってます。むしろ「効果ある気がする！」って思えるくらいなら上々かと。
数字がちゃんとデータに現れたのはGTmetrixのスコアくらいでした。
WP Fastest Cache導入前。
WP Fastest Cache導入後。
PageSpeed Scoreが異常に低いのは高画質の画像とWebフォントだらけだからで、そこは原因が分かってます（見た目とユーザビリティを重視して直すつもりはなし）。
比較という意味ではたしかにページキャッシュして読み込み量と時間が減っているのも確認できます。
現状やっかいな弊害も一切出ていないので、これは導入するべきプラグインだと思います。逆に言うと、プラグインに頼るキャッシュはページ・キャッシュだけでいいというのが今の僕の結論です。そういう流れで、ブラウザ・キャッシュなどもWP Fastest Cacheで利用可能ですが当然使用していません。
「弊害」の話が出たのでちょっと余談ですが。
従来の僕の環境ではCSSを更新するときは必ずブラウザのキャッシュ削除が必要だったのですが、今ではこれが要らなくなっていることに気付きました。
しかしこれがなにによる恩恵なのかが分からない…。ブラウザ・キャッシュだけならエックスサーバーが上手くやってくれているのだろうけど、「CSSを含む」はずなので仕組みが謎だし、ページ・キャッシュも絡むならなおさらよく分からない（WP FCの設定では管理者でもキャッシュ表示してる）。理解不足を感じます…！
→2019/11/17追記：GitHubを覗いていたらCocoon様のおかげということが偶然発見できました。
CSSやJSファイルにタイムスタンプを付加して別物と扱わせているような処理がありました。やっぱりCocoonって神…。
追記 (2019/12/21) ：ページキャッシュによる唯一（？）の弊害に後日気付きました。is_mobile()やwp_is_mobile()を使って処理の分岐をさせている場合、ページキャッシュによってその分岐が死んでしまうという現象。気になる方は下記記事を読んでみてください。
データベース・キャッシュとオブジェクト・キャッシュ
ここは前述の通り利用を見送ることにしたので、特になにも作業はしていない。
このあとに出てくる「エックスサーバーのキャッシュじゃない系高速化機能」もあり、それらがかなり優秀なので特に問題はないと思っています。
気持ち的にも「余計なものが絡んでいない」という断捨離感も持ててgood。
キャッシュ系機能に関するまとめ
というわけで、WordPressに存在する４種類のキャッシュ
- ブラウザ・キャッシュ
- ページ・キャッシュ
- データベース・キャッシュ
- オブジェクト・キャッシュ
に関しての現在の環境をまとめておきます。
| ブラウザ・キャッシュ | エックスサーバーのものを採用。 設定内容は「CSS/JavaScriptも含む」方。 |
| ページ・キャッシュ | WP Fastest Cacheを採用。 |
| データベース・キャッシュ | お祈り。 |
| オブジェクト・キャッシュ | お祈り。 |
まずこれでキャッシュ関連はかなり整理されました。あとは残っているエックスサーバーのややこしい高速化機能もクリアにできたら完璧です。
エックスサーバーが持つその他の高速化機能についても整理
エックスサーバーは昔から高速化機能がとても豊富です。しかししょっちゅう増えては消えて、もしくは名前が変わったり別の機能に統合されたり…みたいなことをやっているのでかなり分かりにくいです。
2019年11月時点でのエックスサーバー サーバーパネル内の機能はこんな感じ。
- Xアクセラレータ
- サーバーキャッシュ設定
- ブラウザキャッシュ設定
と３つありますね。３つめのブラウザキャッシュ設定はもう既に説明を終えているので割愛。
残りの２つについて整理します。
なお、過去にあった「mod_pagespeed設定」はもうなくなりました。（参考）
しかし「引き続きご利用いただけます」って、一体ONの人はどうやって設定をOFFにしたりするんだろう…。もうサーバーパネルにもないんだけど…（ONの人だけ表示されてるの？）
１．Xアクセラレータ
エックスサーバーの高速化機能をややこしくさせている戦犯は間違いなくこいつです。
まず、現在のXアクセラレータがどうなっているかから確認。
Ver.1とVer.2という２つがあることが分かります。
現行版での結論を先に言っておきましょう。ここは無条件でVer.2でいいと思います。
特に弊害やデメリットがありそうな記述はマニュアル等見てもないですし（※）、事実僕にも何も問題は起きていません。それどころかこれは体感でクッソ速くなりました。絶対ONにした方が良い。
※一応下記のような注意事項はありますが、レンタルサーバーで普通のブログ運営をしている人の99%は気にしなくてOKなはず。
それと一応ですが、PHPのバージョンは7.2以降が前提条件です。
…と、ここまでの内容なら全く問題はなく理解しやすいはず。しかし、旧来からエックスサーバーを使っていた方は名称変更によってちょっとよく分からなくなっているかもしれません。
2019年の2月20日からXアクセラレータは機能アップデートみたいのが発生していて、「旧来で"Xアクセラレータ"と言っていたうちのそれぞれの設定が色んなものに分かれますよ」と言っています。
この辺までくると「あれ？」ってなってるはず。「Xアクセラレータ」の旧設定の１つが「サーバーキャッシュ設定」になってるの？？？
次へ。
２．サーバーキャッシュ設定
Xアクセラレータを理解するとこちらが理解不能になります。というのも、サイト上の説明を見る限りではどう見ても同じ設定項目に思えるからです。
まずサーバーキャッシュ設定のマニュアルを見てみます。
CSSとJavaScriptを含む普段使用するファイルはほぼ全てサーバー上にキャッシュされそうなことが分かります。ここがポイント。
次にXアクセラレータVer.1のマニュアル。
同じやん…Ω＼ζ°)ﾁｰﾝ
しかも
これを見る限りでは「現行のXアクセラレータ Ver.1」と「現行のサーバーキャッシュ設定」には明らかに差があると思われるのに…。
考えていても埒が明かないのでカスタマーサポートに問い合わせ。
結果はこうでした。
お寄せいただいた件でございますが、
お客様の仰る通り、「サーバーキャッシュ設定」でも
2分間キャッシュされるファイルの拡張子については同様でございます。
ただ、「サーバーキャッシュ設定」の場合、
それ以外の拡張子のファイルについても、1分間キャッシュされる
仕様であり、こちらが「Xアクセラレータ」との違いとなっております。
なるほど、書いてないけど「さらにそれ以外の色んなファイルも1分間キャッシュしてくれるのがサーバーキャッシュ設定だよ」ということですね。
ここで言う[全ファイル]というのは確かに合ってました。
…が、実際のところなんのファイルに影響があって効果にどう差があるのかは分からない…。「まさかCookieとかかな？」と思ったりもしたけど、関係がありそうな
ウェブサーバー上に、特定のユーザーや特定の環境のみに公開を制限しているコンテンツデータ等がある場合、本来広く公開されていないはずのデータがリバースプロキシ上にキャッシュされ、意図しないユーザーがそれらのデータへアクセス可能となってしまうことがあります。
という記載は例によってどちらのマニュアルにもありました。
もう面倒くさいので結論です。
全部ONにしろ。
これでいいでしょう（雑
実際のところサーバーキャッシュ設定はなんだかよく分からんけどすげえ速くなりました。ECサイトもやってなければログイン専用コンテンツもないのでデメリットは特にないでしょう、これからもこれで行きます。
最後に、旧名称含めてエックスサーバーの高速化機能を図解でまとめて終わりにします。
※ブラウザキャッシュはどことも関連がないので記載してません
おわりに
以上で今回調査・整理した内容はおわりです。だいぶスッキリしたしかなり爆速になりました（それでも僕のブログは高画質画像とWebフォントを多用しているのでもっさりな方なんですけど）。
内容のややこしさゆえにかなり体系的にまとめようと意識したんですが、それぞれの要素が単純に区切れないのでやっぱり難しかったです。
エックスサーバー x Cocoonという条件的に需要のある方は少ないと思われますが（それでもサーバーとテーマの利用者はそれぞれでNo.1のレベルだとは思う笑）、少しでもどなたかのお役に立てましたら幸いです。
エックスサーバーの導入を検討している方は、迷わず即移行するべきです。迷ってたのがアホらしくなるくらい快適なのでつべこべ言わずとっとと引っ越ししましょう。無料体験もできるので不安でも大丈夫です（本番環境と全く同じ状態で試す機能もあります）。
良ければシェアにもご協力ください～