LSCWP×Quic Cloud(CDN)でサイト超光速化!

 ウェブサーバー・LiteSpeedのもとでWordPressのサイトの表示速度をもっと上げたいのなら、LiteSpeed Cache(以下、LSCWP)と言うプラグインの導入は必須といえそうです。LSCWPは基本的な設定だけでサイトを高速化することができますが、それに加えて画像の最適化、CDNの設定などもできるようになっている非常に多機能で頼もしいプラグインです。今回はそんなLSCWPの機能の中からCDNの設定(無料CDNQuic Cloud」の設定)について見ていきたいと思います。

 LSCWP導入でサイト表示速度は劇的に上がる!

ウェブサーバーLiteSpeedはプラグインのLSCWPなしでも反応は良さそうですが、このプラグインを入れると、劇的ともいえるサイトの変化が起こります。※LSCWPの基本的な設定については解説しているサイトはいっぱいあるのでここでは割愛しますね。(私はこのサイト を参考にしました。)

過去にウェブサーバーにApacheを入れているレンタルサーバーから、Nginxを入れているVPSサーバーに乗り替えたときにはすごい衝撃を受けましたが、ウェブサーバーLiteSpeed×LSCWPもその時と同等かそれ以上の衝撃がありました。1000記事以上あって画像をふんだんに盛り込んだ結構重めなサイトでも2秒くらいでパッとサイトが現れるのは見ていて気持ちがいいことこの上なしです。



…でもLSCWP基本設定だけでは高速化しないサイトもある

しかしNginx時代もそうでしたが、LiteSpeed×LSCWP のサイトにおいてもIframeの画像や広告をたくさん設定しているサイトや、Adsenseの自動広告を設定しているサイトなどは思ったほど表示速度(測定値)が上がってこないというのが実情のようです(いや私の環境では、ですよ)。目視した限りではサイトはパッと表示されるので何も問題がないように思えるのですが、GTmetrixで測ると、サイトが完全に表示されるに20秒とか30秒とかかかっているようでした。

LSCWPにはCDNも設定できる!

でも冒頭にも書きましたが、LSCWPはキャッシュの基本設定のほかにも、まだ画像の最適化とCDN設定という高速化の機能が組み込まれているので、測定値を上げるためにもさっそくやってみることにしました。(今回はCDN編です。)

まずはLSCWPCDNのタブをひらく

「設定」→「高度なオプション」→「CDN」のタブを開きます。

ページの一番上には、「CDNを有効にする」という項目が出てきますが、ここは無視します。Quic CloudCloudFlareはページの下の方で個別に設定してONにするためです。

ページを下のほうにスクロールしていくと、Quic Cloud APICloudFlare APIの設定項目が出てくるのがわかると思います。

 

Quic Cloudの設定!

無料で使える二つのCDNのうち今回はQuic Cloudのほうを利用することにします。Quic Cloud APIという文字の横には「オン」「オフ」の切り替えボタンがあり、そのすぐ下にある「Register for free at QUIC.cloud」というリンクがあるのでそこからQuic CloudHPへ飛んでアカウントを作成します。「ユーザーAPIキー」の入力窓の下にある「Quic Cloud」というリンクでもいっしょです。

アカウントの作成にはメールアドレスとパスワードが必要となりますが、その他の個人情報などは一切必要なしです。レジスター(登録)ボタンを押すとアクティベートのためのリンクがメールで送られてくるのでそれをクリックすると、アカウントが作成されます。

アカウントが作成されたらAPIキーの生成(Generate)ボタンを押してAPIキーを生成します。(登録メールアドレスとこの時生成されたAPIキーをLSCWPQuic Cloud APIに入力します。)

次に自分のサイトを登録します。

この時サイトIPが表示されますが、自分の使っているサーバーのIPと同じかどうか確認し、違うIPが表示されていたらサーバーIPと同一のものに修正します。

手順に従って進めていくとCNAMEの設定を変更しろ…と要求されます。

ここまではそんなに難しい設定もなくすんなり進むと思います。

DNSの設定を変える(CNAME登録)

このDNSの設定(CNAME登録)と言うのが私にとっては超難関に思われ正直ビビりました。ネームサーバーを変えるくらいはしたことがありますが、DNSそのものをいじるというのはまさに未知の領域です。AレコードとかMXレコードとかTXTやらなんやら…今まで聞いたことはありますが、「…ふーん、そう。」で済ませてきましたよ。自分にはかかわりのない世界だと思ってましたから。しかしこの未知の領域に足を踏み入れる時が来たのでした。

しかしながらCNAMEを設定しろ、といきなり言われてもどこをどういじればいいのか皆目見当もつきませんでした。ムームードメイン?カラフルボックス?…しかしどれも空振りに終わりネットで検索しても、一から理解するのは時間がかかり過ぎるような気もしてきました。半ばあきらめかけていたわけですが、よく考えたらLSCWPマニュアルに目を通していないことに気づきました(マニュアルはこちら)。マニュアルは英語で書かれていて、きちんと内容が頭に入ってくるまで少し時間がかかりましたが、バッチリやり方が書かれていました(^_^;)ヨカッター

マニュアルによると…フムフム…「www」という接頭辞をつけていないドメイン(Naked domainと言うらしい)でサイトを運用している場合、サーバーのDNSにCNAMEを登録できないパターンがよくあり、その場合はCloudFlareのDNSを間借りして、CNAMEを登録する…と書かれありますね!CloudFlareのDNSを間借りするっていうのは、CloudFlareのCDNとしての機能を使わずにDNSだけを利用するということになります。どうしたらCloudFlareのDNSだけを利用することができるかというと、CloudFlareのDNS画面の右側にあるオレンジ色の雲のマークをクリックして「グレー」にすればいいだけでした。私はこれを理解するだけでも2時間くらい無駄にしました(´;ω;`)

で、マニュアルにはCloudFlareのDNSを変更してCNAMEを登録した設定例の画像があるのですが、どこをどういじったらこうなるのかが皆目見当がつきません。で、今度はWordpress.orgのLSCWPサポートの公開Q&Aみたいなところをチェックしたら…わかりました~(≧▽≦)

>>Wordpress.orgのLSCWPサポートの公開Q&Aのページはこちら<<

…どういうことかというと、デフォルトの「A」レコードと「www」レコードを削除したうえで、CNAMEを登録するということだったのです。Aレコードを削除したところにはCNAME⇒自分のドメイン⇒Quic Cloud指定のアドレス(これをエイリアスと言うらしい)の順に入力して「雲」マークをクリックしてグレー色にしてから登録し、「www」を削除したところには、CNAME⇒www⇒自分のドメインの順に入力し「雲」マークをグレーにしてから登録します。

「A」レコードと「www」レコードの削除っていうのが、はじめはちょっと勇気が要りました。でもよく考えたら、CloudFlareのアカウントなので失敗したらアカウント削除してまた作り直せばいいだけですし、もしCDN設定を止めるとなればネームサーバーを元に戻せばいいだけの話ですから気が楽です。

CloudFlareのアカウントも作る必要がありますよ~!

あ、言い忘れましたが、CloudFlare使ったことがない人は、CloudFlareのアカウントもここで作る必要があります。作り方は長くなるので割愛しますが、誰でもすぐにできるはずです(参考サイトはこれ)。そしてアカウント作成のあと、CloudFlareのDNSだけを利用する場合でも、ドメイン管理会社(私の場合はムームードメインですが)のネームサーバーをCloudFlareのものに変える必要があります。CloudFlareのネームサーバーはアカウント設定の時にサイト側から提示されますよ~!

VPSサーバーなどを運営している人で、PLESK経由でCloudFlareのアカウント持っている人はPLESKの中の自分のサイトに設定しているCloudFlareのサービスを解除する必要があります。PLESKの中でCloudFlareのサービスを解除すると、PLESK経由で作られたCloudFlareのアカウントも消滅するので、改めてアカウントを作り直してトライしてみてくださいね。

Veriryボタンは基本エラーになるので無視して大丈夫!

最初はドキドキでしたが、10サイトも設定すれば、単なる機械的な作業だということがわかると思います。ちなみにQuic Cloudの設定ページには、CNAME設定を終えたら「Veriry」(確認)ボタンを押して、設定が上手くいってるかどうか確認するように書かれていますが、これは基本的にエラーなるので気にしないで大丈夫のようです。(マニュアルにもそう書かれている。設定がちゃんとできたかどうかは、サイト表示の結果がすぐに教えてくれますよ!)

しかしまだ最後の肝心な設定があった!

これで設定は全部終了したのかな~と思いきや、まだ最後の段階が一つ残っていますよ!コレをしないと検索エンジンに「安全でないサイト」や「危険なサイト」と認定されてしまったりするので必須の設定です。サイトがSSL化(HTTPS化)していない時、同様の認定がなされることもありますが、ズバリここでも同じで、Quic Cloudのサーバーに自分のサイトのSSL証明書を通過(多分ですが…)させる必要があります。

といっても手順は簡単で、Quic CloudのHPのドメイン設定画面から、右上にある【[4]SSL Certificate】の文字リンクをクリックしてページを開き…ページ右上のSSL証明書(SSL Certificate)の生成ボタン(Generate Cert)を押して、証明期日と「Generated!」という緑色の文字が現れたら設定完了です。10分くらいかかるみたいなことも書かれていますが、実際は1,2分待ってブラウザを更新すればもうできているはずです。※証明書の「生成」ボタンとなっていますが、元のサイトでSSL証明書をすでにとっている場合は、元の証明書が優先されるようなのでその辺は心配しないで大丈夫です。

 

後は結果を待つだけです!

ここまで来たら、自分のサイトのLSCWPの「CDN」のページに戻り、メールアドレスとAPIキーを入力してQuic CloudのCDNを「ON」にします。もっと前の段階でONにしちゃっても大丈夫でした、私の場合はね。後は結果を待つだけですよ!

設定後、数分たってGTmetrixの数値はどうなったか?

ね、冒頭にあげた同じサイトの測定結果と比較して、完全に表示されるのに30秒以上かかっていたサイトが、CDN設定後は2秒台前半で表示されるようになりました!これって、ものすごい劇的な変化だと思いません??

またまた、言い忘れてしまったことがあります。Quic Cloudは一つのアカウントにつき、登録できるサイトは5つまでのようです。(2019年6月現在。)6つ目のサイトを登録しようとしてエラーになったら、別のメールでアカウント作成すれば大丈夫ですよ。でも、この時は多分サーバーIPとして表示されるものが一つ目のアカウントとは異なってくると思うので統一する必要があります。(何を言ってるのかわからないかもしれませんが、その場面に来たらきっと理解できると思います。)

☆★_ ☆★_

あ、でもここで述べていることはマニュアルにも載っているようなことですが、私の環境ではこうだったよ~という程度のものなので、あくまで参考にとどめてくださいね。時間の経過とともに、もっと安全で合理的な解決方法も生み出されているかもしれないので、ご自分でトライしてみる時には、多少時間をかけても最新情報を調べるか、あくまで自己責任でトライしてみてくださいね。

Quic Cloudの他にもCloudFlareでのCDN設定できるようですが、またそれは次の機会に報告することにしますね。

最後に…

サイトに執着しすぎるのはあまりよろしくないという意見もありますが、ちょっとした設定(調べるのには多少時間もかかりますが)で、劇的に変化する様を見ているとなんというか楽しいものがありますね(^_^;)サイコー!

最後までお読みくださいましてありがとうございます。