WordPress のパフォーマンスチューニング、CloudFlare活用、ExpressWeb

【 この記事は、2103人に読まれています】

※実際に長沢が行ってみたことであり、各設定およびやり方について一切責任を持てません。予めご了承ください。

事実誤認や理解不足もあるかと思います。基本的には私は、マニュアル読まずに実践して試行錯誤する傾向がありますので、この設定も決してお勧めしているわけではありません。

 

ExpressWeb


 

私のこのブログがお世話になっているのは、データジャパンさんの ExpressWeb です。年間3,000円程度で Windows Server のホスティングを提供してくれています。さて、こちらで設定した WordPress についてはいささか、巷で行われているパフォーマンスチューニングがうまく動作しなかったり、効果がでなかったりします。それは、Web サーバーが、IIS であり、.httpaccess を書き換える系のチューニングができないことと、PHP 自体のカスタム設定ができない (※少なくとも私は知らない) ことが大きいかなと思っています。

そこで、ここ数年いろいろと試行をしてきたのですが、ある程度の効果を発揮してきたのでその設定を共有したいと思いました。

 

チューニングの成果


 

まずチューニングの成果です。残念ながらチューニング前のおっそい状態でのデータを記録していなかったので (ぉぃ) ぱふぉちゅうした結果だけですみません。分析は、GTmetrix で行っています。

スクリーンショット 2014-04-04 17.42.30
チューニング前は、読み込みに45秒から数分 (遅い!)かかり、データサイズも最大で5MBくらいとブログにあるまじき状況!リクエストの数が半端なく、かなりよろしくない状況でした (それにも関わらずご購読感謝です)。

それが、上記まで改善できました。まだ リクエストの数もデータ量も多めですね。ちなみに、覚えている限りでチューニング前は、Page Speed Grade が C、YSlow Grade が D でした。

 

チューニング


 

正直何がもっとも効果があったのかをロジカルに説明できるほど親身にセッティングしていたわけではありませんが、大きかったのは、

CloudFlare の利用です。

 

CloudFlare


 

CloudFlare は、CDN のサービスです。これを使い CSS や JavaScript、Image などをキャッシュしてパフォーマンス改善を行いました。もちろん、Wordpress のプラグインもいろいろと試しましたが、それだけで効果的な改善につながったことは今までありませんでした。その多くが ExpressWeb では設定できない (※と私は思っている) IIS の設定 (.httpaccess 由来の設定) や PHP の設定 (Object Cache など) ですので致し方ありません。

ClouFlare の導入方法については、いろいろなサイトに手順が載っていますのでそれを見ていただければいいのではないかと思います。私は手順を見ずに CouldFare のナビゲーション通りに設定しましたが、それで十分でした。

ただ、一点とても助かった情報があります。

表示スピードの高速化に役立つ!JavascriptやCSSファイルに自動で付与されるバージョン番号を非表示にする方法  | gori.me


これは、知りませんでした。以前より、CloudFlare はこっそり (?) 利用していたのですが、実はまったくパフォーマンスに貢献できる感がなく、そのまま放置していました。その後、ドメイン名を変更したのを機にすっかり忘れていましたが、先日再び新しいドメインでの登録をし直した際に、この情報を知り、設定しました。

これが効果覿面!上記の改善につながりました。

また、私が設定した CloudFlare の項目は以下になります。

 

CloudFlare Setting Overview


スクリーンショット 2014-04-04 21.59.37
Performance Profile は今まで  CDN Only にしていたのですが、CDN + Full Optimizations にしてみました。CDN + Basic での効果はまだ見ていません。

そして Performance の詳細では、以下のようにしています。

スクリーンショット 2014-04-04 22.02.29
Caching level は、Aggressive にています。Auto Minify による JavaScript や CSS の Minify はすべてにチェックしました。そして、既定で Automatic だと思いますが、Rocket Loader の設定をしています。

ここでのポイントですが、今まで WordPress の Minification 関連のプラグインで効果がないか、表示や動作に問題がでていたものが、CloudFlare の設定下では、問題が起きなかったところです。複合的な要因があるのだと思いますが、うまく表示と動作がされているようなので、すべて ON で運用しています。

 

CloudFlare 用 WordPress プラグイン


 

さて、私が CloudFlare 用に WordPress に適用したプラグインですが、以下です。

  • スクリーンショット 2014-04-04 22.07.45
  • スクリーンショット 2014-04-04 22.08.24

CloudFlare プラグインは、CloudFlare の設定やその制御用のプラグインですね。一点ポイントですが、CloudFlare を利用していると Windows Live Writer などで書いたブログ記事を投稿できない場合があります (タイムアウトになります)。この場合は、この CloudFlare プラグインにて、Development モードにしたうえで投稿するとうまくいきます。で、そのあと Development モードを OFF に戻しておきます。Wordpress で直接投稿や編集する場合は問題ありませんでした。

CloudFlare Cache Purge は、Wordpress の管理画面からキャッシュを Purge することができる便利なプラグインです。まぁ、ほとんど使いませんw

さてさて、再び、CloudFlare の機能に戻りますが、こちらでは、いくつかのアプリケーション (Apps) を利用するようにしました。

スクリーンショット 2014-04-04 22.14.35
 

スクリーンショット 2014-04-04 22.15.43
要は JavaScript の CDN を使ったということですね。

 

CloudFlare の懸念点


 

個人的に CloudFlare には、とても助かっているのですが、懸念点と思っている部分もあります。CloudFlare は、設定時に DNS の設定を CloudFlare 指定の Name Server に変更する必要があります。ExpressWeb でドメインを取得した場合は、あらかじめ DNS の指定がされていますが、これを変える必要があります。なので、DNS のキャッシュが効いている期間では、CloudFlare の恩恵を受けられているか判断つかないので、1 ~ 2 日くらい様子を見る必要があります。また、DNS を CoudFlare 指定のものにしていますので、CloudFlare のサービスに障害やメンテナンスが発生すると 「DNS を引けない = ブログにアクセスできない」 という事態になるかもしれません (当ブログには SLA はないので、つながらなかったらそれはそれでいいやというスタンスなので問題ありませんがw ちなみに、Jetpack の通知機能によれば、このブログは1日に3回くらいアクセスできない事態が起きているようです。これは CloudFlare にする以前からですので、単にアクセス過多もしくは、サーバーに負荷をかけすぎなのかもしれません)。

 

WordPress プラグイン


 

そのほか、キャッシュ関連の WordPress プラグインなども併用しています。これらについては、Web パフォーマンスを見ながら適用を判断しました。判断基準は、なんらかの数値に貢献できていたら アリ。貢献が見えにくければ ナシ。単純な判断基準です。また、キャッシュ関連については、実際に ExpressWeb のファイルエクスプローラーで、キャッシュファイルが生成されているか?そのサイズは効果に見合っていそうか?を直接確認しています。キャッシュファイルが生成されていないか、判断が付かなかったプラグインは、ナシと判断しました。

パフォーマンスに関するプラグインは現時点で以下のものを適用しています。

スクリーンショット 2014-04-04 22.22.03
001 Prime Strategy Translate Accelerator は、Wordpress の翻訳ファイルをキャッシュしてくれるものでローカライズ版の WordPress を使っている場合は効果を発揮します。MO Cache が有名ですが、MO Cache を優先順位の高いプラグインとして設定したらキャッシュファイルをどこに生成しているのかわからなくなったので、はっきり効果のあった 001 ~ を使うことにしました。いろいろ見ていますが、こちらは効果がでていると判断できました。

スクリーンショット 2014-04-04 22.24.56
DB Cache Reloaded Fix は、DBへのクエリをキャッシュし、クエリの回数を削減するプラグインです。こちらも Web パフォーマンスを計測して多少の改善が見られたので アリ としました。

スクリーンショット 2014-04-04 22.27.00
数あるキャッシュ系プラグインの中では、あまりメジャーではないのかなと思いつつ、一番効果があった Lite Cache を採用しました。Quick Cache などメジャーなキャッシュプラグインもありますが、こちらもキャッシュされたファイルを直接確認して、ロードしたページについてキャッシュファイルを生成しているか?gzip 圧縮ファイルが生成されているか?といったところまで確認しました。.httpaccess が使えない IIS で、ここまでやってくれるプラグインはなかなかないかなと思います。ほかにも圧縮もしてくれたプラグインはあったのですが、Firefox では読み込めないものがあり、そちらの利用を断念しました。

スクリーンショット 2014-04-04 22.31.56
WP File Cache は、Wordpress が動的に生成するページをキャッシュしてクエリ回数なども削減できるプラグインです。MO Cache と併用して使う名残 (?) で利用しています。こちらも Web パフォーマンスを見ながら多少効果があったので採用しています。

スクリーンショット 2014-04-04 22.35.42
WP Performance Pack は、正直なんで入れたのか忘れてしまいましたw 翻訳ファイルのキャッシュなど前述のプラグインとほとんどかぶっていますw 今のところ、動作に問題ないのでそのままにしています。

スクリーンショット 2014-04-04 22.37.23
WP Widget Cache は、Widget のキャッシュをしてくれるプラグインです。こちらはとても重宝しており、昔から使っています。効果のほどは実はよくわかりませんw はてブの数などのリスト部分、投稿一覧などをキャッシュしています。リクエスト数の削減につながるはずなので採用しています。

スクリーンショット 2014-04-04 22.39.44
WP Smush.it は、Yahoo! のサービスで、画像ファイルから不必要な情報を削除してファイルサイズを削減してくれるものです。こちらを使って必要最低限な画像ファイルとなるようにしています。

そして、「これは使わないほうがよかった」というプラグインも紹介しておきましょう。使っていたが、これらの設定下では効果を発揮していないと判断したか、もしくは、動作が怪しくなったので利用を止めたものです。

Lazy Load 系のプラグイン。Lazy Load は、画像ファイルを一気に読み込むのではなく画面に表示される際に読み込むようにしてパフォーマンスを改善する手口ですが、今の設定下では、これが動作を不安定にさせていました。なので、今は使っていません。また、今の設定でなければ、Lazy Load による改善効果は一定の範囲で効果がありました。なので、あくまで今の私のブログの設定下では効果がなくなってしまっただけです。

 

Jetpack の設定


 

次に、Jetpack の設定です。Jetpack は定番となっているプラグインですが、その機能の中にも役立つものがたくさんあります。

スクリーンショット 2014-04-04 22.42.31
Photon は、画像ファイルを CDN から読み込んでくれるようにする機能です。CloudFlare で同じことをしてくれているような気がしますが、併用しています。Smush.it でサイズを削減し、それを CDN においてそこから読み込むするようにしているいった感じでしょうか。

ちなみに、Jetpack の役立つ機能は、不要になったらこまめに「停止」しています。この停止の仕方がいまいちよくわからなかったのですが、「さらに詳しく」をクリックすると「停止」ボタンが現れることに気が付きました。ちょっとわかりにくいですね。

使っていないなと思う機能は、停止しています。

 

まとめ


 

ご覧いただい用に、CloudFlare を採用し、Wordpress のプラグインと併用することで ExpressWeb での WordPress でパフォーマンスの改善効果が得られました。あくまで私が試行錯誤した結果の記録であり、動作および改善を証明する根拠は示していない点をご注意ください。ここに書いてあることを実践しようする場合は、あくまで自己責任で行ってくだださい。ずーっとパフォーマンスが得られないブログで、そろそろ LAMP なサーバーに変えようかなと思っていたのですが、ExpressWeb のサービス自体はとても安定しており、なにより、安価でそこそこの性能のホスティング環境を提供してくださっているので、気に入っています。このまま継続利用できそうでほっとしているといったところです。

なお、Windows Server ならびに IIS 自体については、チューニングが行えます。今回はあくまで ExpressWeb での制約 (と私が思っている) 下で行ったものであり、Windows Server ならびに IIS が遅いということではありませんので、勘違いはなさらないでください。

 

 

【 この記事は、2103人に読まれています】