表示速度を劇的に向上する、無料のCDNサーバー「CloudFlare」は導入必須だ!!

Cloudflare
The faster, the better!ブログの表示速度向上は永遠の課題だと思っているg.O.R.i(@planetofgori)デス!

gori.meは比較的画像が多いため、どうしても読み込み速度が遅く、以前から色んな方法を試して改善に努めてきた。その中でも間違いなく効果があると言える無料で利用できるCDNサーバーCloudFlare」を紹介する!!ウェブ運営者、ブロガーは間違いなく導入した方がいい!


そもそもCDNとは何か?

まず、CDNについて簡単に説明する。CDNは「Contents Delivery Network」の略で、ウェブコンテンツを配信するために最適化されたネットワークのことを意味する。

ウェブサイトにある画像や動画などの高容量コンテンツをウェブサービスが提供されているサーバーとは別のサーバーにキャッシュし、代わりに配信して負荷分散するという仕組み。ここでいう「別のサーバー」というのがCDNサーバーであり、今回紹介する「CloudFlare」である。

CDNサーバーを使った場合と使っていない場合のイメージを描いてみた。画像や動画をCDNサーバーにキャッシュしておくため、負荷を分散してページの表示速読を速くすることができる。

CDNサーバーとは
CDNサーバーとしては、Akamai TechnologiesやAmazon CloudFrontが有名だ。特にAkamaiについてはYahoo!やGoogleの大手検索エンジンで利用されているサービスだ。

「CloudFlare」の登録方法

登録作業自体は5分ぐらいで完了する。設定手順は以下の通り:

  1. ここから新規アカウントを取得し、ウェブサイトを登録。
  2. 無料版と有料版を選ぶ画面になるので、遠慮無く無料版を選択!
  3. あとはCloudFlareが勝手に必要情報を勝手に取得してくれるので、確認して進めていけばOK。
  4. CloudFlare側の情報取得が完了すると新しいDNSが付与されるので、利用しているDNSサーバーに登録されている情報を新しく付与されたDNSに変更する。ちなみに僕はムームードメインを利用しているので、「コンパネ>管理コントロールパネル>ネームサーバ設定変更」から新しいDNSに書き換えた。

これで設定完了!ものすごく簡単!

僕は既に登録してしまっているので、スクリーンショット付きでのCloudFlare登録方法は紹介できないのだが、IDEA*IDEAにCloudFlareの登録方法が書いてあったので、スクリーンショットと一緒に設定したい人は以下からどうぞ!

【画像付き導入記】 CloudFlareが便利そうなんでWordpressブログに導入してみた | IDEA*IDEA
スクリーンショット付きで登録方法が紹介されています!

気になる「CloudFlare」の効果

CloudFlareを導入後、gori.meのページ読み込み速度は体感できるほど変わった。今でこそは様々なチューニングをしているつもりなのでその効果もあるかもしれないが、見るからに効果が出た。

定量的なデータは無いのだが、CloudFlareの管理画面によると過去30日おけるリクエスト数の80%を分散し、回線の帯域を86%も減らすことに成功している。
Cloudflare analytics

ウェブサービス運営者やブロガーは絶対導入した方がいい!

CloudFlareは無料の負荷分散サービス。無料で効果が出ていることも分かっているので、まだ試したことがない人には是非ともオススメしたい。

特に、僕のように画像を多く使っている場合はCDNサーバーの恩恵を大いに受けることができる。スクリーンショット多用するブロガーや商品画像などを大量に使うECサイトは導入を検討してみはいかがだろうか!

ホーム| CloudFlare | Webパフォーマンス&セキュリティ会社


ブログの高速化に貢献!画像をあとから読み込むプラグイン「jQuery Image Lazy Load WP」が便利! | gori.me

CDNサービス「CloudFlare」で一時的にキャッシュをOFFにする方法 | gori.me

オススメ

gori.meの最新情報をチェック!!

  1. 精算不要の「Amazon Go」、登場!万引きにしか見えない最先端スーパー
  2. 「iOS 10.2 Beta 6 / Public Beta 6」、配信開始
  3. Twitter 、2016年の人気ツイートをまとめたランキング「2016年振り返りツイート」を公開!
  4. 【保存版】iPhoneのストレージ容量不足を劇的に解消する7つの方法
  5. 【保存版】Macの「その他」を削除し、ストレージ容量不足を解消する方法