ページの読み込み速度を劇的に改善！CloudFlareとW3 Total Cacheを組み合わせて高速化する方法

【img via 20100929_techcrunch_mw_058 by TechCrunch】

当ブログは「CloudFlare」という無料のCDNサーバーを導入している。

これまでは導入するだけでそれなりの効果を発揮していたので満足していたが、ページスピードの更なるスピードアップを実現するためにW3 Total Cacheの設定を見直すことにした。

結果、読み込み速度を劇的に改善することに成功したので、僕の設定内容を紹介する！

W3 Total CacheとCloudFlareの組み合わせは最強！

W3 Total Cacheを使っている人であれば分かるかもしれないが、デフォルトでCloudFlareの設定が組み込まれている。それらの設定を利用してこそ最も力を発揮するが、まずはHTML、CSS、Javascriptの各ファイルが正しくCDNサーバー上にキャッシュされるように以下の設定を確認するべし！

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

上記設定が完了したら次に進もう！今回設定するのはサイドバーから「Performance ＞ General Settings」を開き、「Network Performance & Security powered by CloudFlare」にある項目。僕が設定した内容は以下の通り！

「Security Level」は「Medium」

CloudFlareを挟むことによって、DOS攻撃などのサイバーアタックを未然に防ぐことができる。ここではセキュリティの強度を設定できるようになっている。僕は先日からブログ経由で大量のSPAMメールが送られてきていたので、念のため「Medium」に設定してある。

「Rocket Loader」は「Automatic」

「Rocket Loader」はJavascriptの読み込みを改善してくれる機能。スクリプトがページの読み込みを遅延させないようにする他、複数のスクリプトのリクエストを一本化したり、各スクリプトを非同期に読みこんでくれるなど、スピードアップに大きく貢献してくれる。詳しいことは分からないので自動的に処理してくれる「Automatic」に設定。

「Minification」は「CSS, Javascript, and HTML」

「Minification」はHTMLやCSS、Javascriptファイルに書かれている不要な余白やコメントを除去してくれる。僕は3つともすべてMinifyした。

CDNサーバーを活かして読み込み速度を改善！

僕の周りでもW3 Total Cacheを使っている人は多いが、CloudFlareに登録している人はあまり聞かない。

「表示速度を劇的に向上する、無料のCDNサーバー「CloudFlare」は導入必須だ！！」にも書いたが、CDNサーバーを介することによって画像やCSS/Javascriptなどのファイルをキャッシュしてくれるため、表示速度の改善が見込める。

ページの読み込み速度は媒体運営者にとって重要な課題だ。本気でスピードアップを試みるのであればW3 Total CacheとCloudFlareを組み合わせて使ってみることをオススメする。