【Mixhost + Cocoon】WEBサイトの高速化に役立つプラグインとテーマ機能を紹介!

ブログ

今回は、私が当サイトで高速化に利用している各種プラグインやテーマ内蔵の機能を紹介したい。

レンタルサーバーが「Mixhost」WordPressテーマが「Cocoon」の場合には高い効果を望むことができる組み合わせだ。

また、「PageSpeed Insights」のスコアも大きく上げることができる。

WEBサイトの高速化に使用しているもの

それでは前置きを後回しにして、私がWEBサイトの高速化に使用している設定やプラグインを紹介していきたい

複数のものをうまく組み合わせることで、効果的にWEBサイトを高速化することができる。それにより、「PageSpeed Insights」のスコアも大きく上げることが可能だ。

Cocoonの「サイト高速化」

こちらは、管理者画面の左側サイドバーの「Cocoon 設定」にマウスカーソルを合わせることで展開されるメニュー内の「高速化」という項目からアクセスできる。

このページでは、ブラウザキャッシュの有効化ソースコードの縮小化、そして画像やWEBフォントの遅延読込外部機能の事前読み込みの設定を行うことができる。

とくに、ソースコードの縮小化(圧縮化とも)に関しては、Cocoon内蔵の機能がとても優秀なので、外部のプラグインの機能を使う必要はない。

LiteSpeed Cache

サーバーのキャッシュや、Cocoonの高速化では補うことができない細かな最適化を実装するプラグイン。

Mixhost」や「JETBOY」など、Apache系で「LiteSpeed」と呼ばれるシステムを導入しているWEBサーバーと相性がいいプラグインだ。

こちらのプラグインは、サーバーのキャッシュの利用と、Cocoonの高速化では設定しきれない部分も埋める目的で導入した。このため、ソースコードの圧縮やブラウザキャッシュといった、Cocoonと競合して不具合の発生が懸念される機能は利用していない

また、JavaScriptの遅延化や画像の圧縮といった機能は、個別のプラグインを使用したほうがPageSpeedのスコア上昇の効果が高い。なので、他のプラグインのほうが優れている機能も利用していない

スポンサーリンク

Async JavaScript

JavaScriptの非同期読込、もしくは遅延読込を設定することができるプラグイン

JavaScriptの読み込みに関する設定は、こちらのプラグインで最適化したほうが良い

その理由は、LiteSpeedに内蔵されている同様の機能を使ったところ、なぜかPageSpeedのモバイルスコアが落ちてしまったからだ。なので、おそらく他のキャッシュ系プラグインでも同様の現象が起きてしまうだろう。

EWWW Image Optimizer

メディアにアップロードされた画像やGIFを、全自動で最適化するプラグイン

画像の最適化については、このプラグインだけですべて事足りる。

ただし、初回の圧縮は時間がかかるので、気を付けたい。

組み合わせて高速化を行う理由とは

それでは、WEBサイトの高速化にあたって、4つの最適化システムを組み合わせた理由を説明したい。

まず、Cocoonには「サイト高速化」という機能がデフォルトで装備されている。なので、ある程度まではWEBサイトを高速化することが可能だ。上で述べたように、ソースコードの縮小化機能は優れている。

また、Mixhostなど、サーバーのコントロールパネルに「cPanel」を使用するサーバーならば、それらに内蔵されたWEBサイトの最適化機能を使うことも可能だ。

しかし、それだけでは十分な高速化は望めない

そのため、サーバーのキャッシュの有効化であったり、より細かなソースコードの圧縮や読み込みの遅延化、画像の圧縮などの、それぞれ各分野で長所が光るプラグインの導入を行う必要がある

なぜなら、全てにおいて勝る総合的な高速化プラグインというものは存在しないからだ。なので、苦手な機能は、同じ機能を持つ別のプラグインで補えばよい。

こうして、これらを競合しないように組み合わせることにより、高速化において最大限の効果を発揮することができるのだ。

これが、テーマ自体の設定と、複数のプラグインを組み合わせた理由になる。

終わりに

今回は、Cocoonの設定といくつかのプラグインを組み合わせることで、WEBサイトを高速化し、「PageSpeed Insights」のスコアを上げる方法を紹介した。

今のところ、私の環境ではこれがベストな組み合わせとなっている。

なので、当WEBサイトと同じ環境の人には参考になると思う。

それでは、また。