ConoHa WINGと契約したけど、表示速度が遅いなぁ。
今回はこのようなお悩みにお答えします。
しかも無料で利用できます。
そこで今回はWEXAL®を設定して、表示速度を高速化する方法を解説します。
あわせて「どれくらい高速化されるのか」をエビデンス付きで紹介します。
画像たっぷりで解説するので、ぜひご覧ください。
追記です。
サーバー未契約の方にはConoHa WINGの評判とデメリットの記事もおすすめです。
\ 読みたい場所にジャンプする /
ConoHa WINGのWEXAL®とは
WEXAL®(ウェクサル)とは、プライム・ストラテジー社が提供するWordPress高速化エンジンです。
ConoHa WINGでは、WEXAL®を無料で利用できます。
WEXAL®を設定するメリットは、以下の2点です。
- 表示速度の高速化
- 転送量の削減
表示速度の高速化
WEXAL®は以下の方法により、表示速度を高速化します。
- AIがJavascripファイルとCSSファイルを圧縮し軽量化する
- 画像をWebPに変換して軽量化する
- ブラウザキャッシュにより、読み込み速度を高速化する
専門用語が並びますが設定は簡単なので、ご安心ください。
Javascripファイルの圧縮とは
JavaScript(ジャバスクリプト)とは、WordPressに動きをつけるためのプログラミング言語です。
JavaScriptの用途は、主に以下になります。
- 形や色が変わるボタン機能
- スライドショー
- ポップアップウィンドウ
- ログイン画面
Javascripファイルを圧縮することで、JavaScriptコードから不要な文字を削除しファイルサイズを軽量化できます。
その結果、表示速度が向上します。
CSSファイルの圧縮とは
CSSとはWordPressの文字の色や大きさ、背景、配置など見た目を設定するため言語です。
CSSファイルを圧縮することで、CSSコードから不要な文字を排除しファイルサイズを軽量化できます。
その結果、表示速度が向上します。
参考情報:Udemyメディア
WebPとは
WebPとは、Googleが開発した次世代画像フォーマットのことです。
画質を保ったまま、画像を軽量化できることが特徴です。
画像をWebP化すると、以下のように画像ファイルを軽量化できます。
- 可逆圧縮の場合:同じ画質のPNG画像より約26%軽量化
- 非可逆圧縮の場合:同じ画質のJPEG画像より約25〜34%軽量化
画像をWebPに変換することで、表示速度を高速化できます。
プラウザキャッシュとは
ブラウザキャッシュとは、読み込んだ情報を一時的にブラウザに保存する機能です。
ブラウザキャッシュにより、読者が2回目以降ブログを閲覧する際に素早くページが表示されます。
転送量の削減
転送量上限を超えると、ページ表示速度が大幅に低下します。
WEXAL®は以下のファイル容量を大幅に圧縮するため、転送量を削減することができます。
- Javascripファイル
- CSSファイル
- 画像ファイル
ConoHa WINGでは転送量が無制限のため、WEXAL®の役割は表示速度の向上がメインとなります。
ConoHa WINGの転送量
ConoHa WINGのWEXAL®の高速化設定
この項目では、ConoHa WINGのWEXAL®により表示速度を高速化する方法を解説します。
- WEXAL®を設定する
- プラウザキャッシュを設定する
- WordPressが最適化されたことを確認する
WEXAL®を設定する
ConoHa WINGのコントロールパネルから【サイト管理】⇒【高速化】をクリックします。
【WAXAL】のタブを選択し、WAXALをONに切り替えます。
基本設定
基本設定は、以下のように設定します。
項目 | 設定方法と解説 |
---|---|
最適化モード | 【スタンダード】を選択 ⇒【プロフェッショナル】を選択するとファーストビュー高速化設定を詳細設定できる ⇒ただし詳細設定は「高速化の除外設定」のため不要 |
自動最適化 | 【ON】を選択 ⇒記事を追加・更新すると自動的にコンテンツを最適化する |
WEBコンテンツ最適化
WEBコンテンツ最適化は、以下のように設定します。
項目 | 設定方法と解説 |
---|---|
画像最適化 | 【ON】を選択 ⇒画像形式をWebPに変換し軽量化する |
画像圧縮レベル | 80に設定 ⇒値が小さいほど画像は軽量化するが、画質は粗くなる |
CSS最適化 | 【ON】を選択 ⇒CSSコードから不要な文字を削除しファイルを軽量化する |
JavaScript最適化 | 【ON】を選択 ⇒JavaScriptコードから不要な文字を削除しファイルを軽量化する |
ファーストビュー高速化
ファーストビュー高速化は、以下のように設定します。
項目 | 設定方法と解説 |
---|---|
LazyLoad(画像) | 【無効】を選択 ⇒有効にすると、WordPressのデザインが崩れる |
LazyLoad(CSS・JavaScript) | 【有効】を選択 ⇒CSS・JavaScriptコードを全て読み込む前に、一部を先出しする ⇒WordPressのデザインが崩れたら【無効】に戻すこと |
LazyLoadとは
LazyLoadとは、読者が見ているコンテンツのみを表示させて、見ていないコンテンツを後から表示させる技術です。
読者がWordPressを開いた時、見ているコンテンツのみを先出しするため、表示速度が高速化します。
ただしデザインが崩れることがあるため、異常が発生したら無効に設定しましょう。
プラウザキャッシュを設定する
【キャッシュ】のタブを選択します。
キャッシュ
キャッシュは、以下のように設定しましょう。
項目 | 設定方法と解説 |
---|---|
コンテンツキャッシュ | 設定しない ⇒WAXALを設定すると、コンテンツキャッシュは設定できない |
プラウザキャッシュ | 【ON】に設定 ⇒詳細はプラウザキャッシュで解説 |
WordPressが最適化されたことを確認する
WEXAL®によりWordPressが最適化されると、ステータスに「最適化完了」と表示されます。
これで、WEXAL®の高速化設定は完了です。
ConoHa WINGのWEXAL®で高速化設定後の表示速度
表示速度は、PageSpeed Insightsで測定しました。
評価指標は以下の2つです。
- パフォーマンススコア(点):表示速度の総合点
- LCP(秒):メインコンテンツが表示されるまでの時間
詳細なテスト条件は、以下をご覧ください。
- テストサイト:スムージーピュアライフ
- WordPressバージョン:6.2.2
- WordPresssテーマ:Cocoon
- 測定日、時間:平日の22時前後
- 測定値:20回測定時の平均値を採用
- 対象デバイス:モバイル
パフォーマンススコア
指標 | 初期設定時 | 高速化設定後 | 差 |
---|---|---|---|
パフォーマンススコア | 79.7点 | 90.4点 | +10.7点 |
WEXAL®の高速化機能を設定することで、パフォーマンススコアが+10.7点向上しました。
LCP
指標 | 初期設定時 | 高速化設定後 | 差 |
---|---|---|---|
LCP | 4.6秒 | 3.0秒 | -1.6秒 |
WEXAL®の高速化機能を設定することで、LCPが-1.6秒速くなりました。
ConoHa WINGは速いね!
ConoHa WINGのWEXAL®を導入することで、表示速度が大幅に向上します。
ConoHa WINGのWEXAL®の質問集
- WEXALは日本語でなんと読みますか?
ウェクサルと読みます。
- WEXALにデメリットはありますか?
既存のWordPressテーマやプラグインと機能が被り、WordPressのデザインが崩れることがあります。
特にLazyLoadを設定することで、デザインが崩れることが多いです。
デザインが崩れたら、LazyLoadをOFFに設定しましょう。
- 解約時にWEXALの設定を変更する必要はありますか?
変更する必要はありません。
ただしWordPressを他社サーバーに移行する場合、移行先でWEXALを利用できません。
サーバーを移行する場合は、移行先の高速化機能を活用しましょう。
まとめ
今回は、ConoHa WINGのWEXAL®により表示速度を高速化する方法を解説しました。
さくっと内容をまとめます。
- WEXAL®(ウェクサル)とは、無料で利用できるWordPress高速化エンジン
- コントロールパネルから簡単に設定可能
- 設定するだけで、パフォーマンススコアとLCPが大幅に改善
今回の内容は以上です。
コメント