手軽に使えるCDN、WordPress「Photon」プラグインを使ってブログを高速化

ブログの高速化

今回は、CDN(コンテンツデリバリーネットワーク)を用いてブログを高速化する方法です。

これまで、このブログには以下の四つの設定を一つ一つ施してきました。

これらの設定は、一つ一つ行っていけば、さほど難しくはありません。おまけに、ブログの見た目も変化させる必要もなく、結構な効果があるので、お勧めの設定です。

さて今回は、CDNを利用したWordpressプラグインの「Photon」という機能を利用して高速化を図りたいと思います。

photo by Marcus Ruhkiek

スポンサーリンク
レクタングル(大)広告

CDNとは?

サーバーイメージ

CDNとは、コンテンツデリバリネットワークの略で、、画像や音楽のようなファイルサイズの大きいデジタルコンテンツを、配信するためのネットワークです。

閲覧者とサーバーの間にCDNを置いて、そこに大きなファイルのキャッシュが作成されることで、画像はCDNから、HTMLは自前のサーバーから、と負荷を分散することで表示速度改善を図るためのものです。

今回はそのCDNを利用するために、「Jetpack by WordPress.com」というプラグインの機能の一つ「Photon」を利用したいと思います。

「Photon」の設定方法

WordPress.com - Get a Free Website and Blog Here

JetPackは、wordpress.comを運営しているautomattic社のプラグインなので安心して使うことができます。

設定などもとても簡単に行うこともできます。主な手順は以下です。

  1. wordpress.com」のアカウントを持っていない場合は取得。
  2. Jetpack by WordPress.com」プラグインのインストール。
  3. 「Photon」機能をONにする。

ブログの高速化をしようという人が、プラグインのインストールの仕方をわからないなんてことはないと思うので、3から説明します。

まずは、Wordpress管理画面から、「Jetpack→設定」に移動します。

Jetpack

Jetpackの機能一覧が表示されるので、その中にある「Photon」のところにマウスオーバーし、「有効化」してください。

Jetpackの機能一覧

これで、CDNがもう使えるようになっています。めちゃくちゃ簡単ですね。

Photonが有効化されると、以下のように表示されます。

Photonを有効化した様子

設定前と後の変化

さて、設定の効果はあったでしょうか。PageSpeed InsightsGTmetrixWebsite speed testで、設定前後のスコアを計測してみました。

PageSpeed Insights

だいたい同時刻に計測。

設定前

PageSpeed Insights設定前

設定後

PageSpeed Insights設定後

特に変化はありませんでした。提案的にも変化なし。

GTmetrix

だいたい同時刻に計測。

設定前

GTmetrix設定前

設定後

GTmetrix設定後

あらあら、下がってしまいました。ページロード時間も増えています。

Website Speed Test

だいたい同時刻に計測。

設定前

Website Speed Test設定前

設定後

Website Speed Test設定後

こちらは、スコアが少し上がり、ページ読み込み時間も少し早くなりましたが、大した変化はない模様。

まとめ

今回の、CDNを用いた高速化は、あまり変わらないという結果になりました。

調べたのがトップページで、大きな画像が少ないからかなと、画像の多い記事のページで同様に試しましたが、結果は変わらず。もしくは、少し遅くなるといった感じでした。

これらの原因として以下のようなことが考えられます。

  1. このブログは、CDNが必要なほどアクセスがなく負荷がそれほどない
  2. 使っているサーバー(XSERVER)がいいので今のところ必要ない

このブログは、1日に、3000PVくらい。XSERVERを使っていて、これぐらいのPVだとCDNは、まだまだ必要ないようです。

おそらく、PVが1日に、1万、2万を超えるようなブログであれば、負荷分散のため必要になってくるのではないかと思います。

基本的に、XSERVERを使っている場合は、サーバーが優秀なので1日5000未満のPVなら特に必要ないのかも。このブログに全く高速化設定を施していない時に、1日2万3000PV来た時も、特に問題はありませんでした。

PV2万3000の時のGoogle Analytics

高速化設定をしてない状態で、トラフィック増大時に、サーバーが落ちた様子もない模様。サーバーもデフォルトのWordpressも優秀です。

ということで、このブログに1日何万のアクセスが恒常的に来ることなんて、ありえないので、こっそりとPhotonの機能はオフにするのでした。

そして、こっそりとXSERVERの宣伝。

『手軽に使えるCDN、WordPress「Photon」プラグインを使ってブログを高速化』へのコメント

  1. 名前:yuta*゚ 投稿日:2014/08/11(月) 11:03:04 ID:d92b40478

    Photon Jetpackの読み込み速度について、

    1つの画像に対して、最初と2回目の読み込み速度は遅いですが、3回目以降は速くなります。

    レイテンシ平均およそ30msの、読み込み速度平均9Mbpsになります。

    たぶん、2回目の読み込みでキャッシュを持ってくれて、3回目以降で速く表示できる、かと思われます。

    なので、計測用に表示させるすべての画像をあらかじめ画像単体読み込み+2~3回リロード(しかもCtrl + F5)やっておけば、また結果は違うのかも知れません。

  2. アバター画像 名前:わいひら 投稿日:2014/08/11(月) 17:52:36 ID:3655aca85

    なるほど。
    動作を確認時に、1回、2回くらいはリロードしたかもしれませんが、3回はやってませんでした。
    今度是非試してみたいと思います。
    アドバイスありがとうございます!

  3. 名前:みゆ 投稿日:2015/04/08(水) 17:00:37 ID:3aa71acca

    こんにちわ

    キャッシュするCDNサービスであれば基本は2回目からキャッシュ配信されるため3回目からキャッシュするということは少ないと思います。
    海外CDNの場合は実は導入して遅くなってるということもあるためピークアクセスの際に計測したほうがより正確かとおもわれますよー。

  4. アバター画像 名前:わいひら 投稿日:2015/04/08(水) 19:33:43 ID:4c4a9f2ca

    こんにちは。

    キャッシュするCDNサービスであれば基本は2回目からキャッシュ配信されるため3回目からキャッシュするということは少ないと思います。

    僕も、そう思っていたのでそこまでリロードはしていませんでした。
    とは言っても、それについて議論をしたいわけではなかったので、上記のようにコメントしました。事なかれで申し訳ないです。

    海外CDNの場合は実は導入して遅くなってるということもあるためピークアクセスの際に計測したほうがより正確かとおもわれますよー。

    もちろんそうなのですが、当時記事を書く時間が限られていたのでご容赦ください。