エックスサーバーでの高速化設定の方法【スコア85から99にUP】

フェニック

エックスサーバーは、プラグインなしで表示速度を上げれるらしいけど本当？

今回はこのような疑問にお答えします。

エックスサーバーには、表示速度の高速化機能が標準搭載されています。

この機能を活用することで、ページ表示速度を大幅に改善することができました。

そこで、今回はエックスサーバーの高速化機能の設定方法を解説します。

表示速度が劇的に改善するので、ぜひお試しください。

この記事の著者

Shota　@Shota_Lab_1

歴3年の副業ブロガー。月間32,000PVのブログフェニックスを運営。
X（Twitter）のフォロワーは5,000人以上

著者情報の詳細

当サイトのテーマ｜SWELL

¥17,600（税込）

導入方法を見るCocoonから乗り換え

エックスサーバーの高速化設定後の表示速度

この項目では、エックスサーバーの高速化機能で表示速度が改善した実例を紹介します。

また併せて、評価指標と測定条件も解説します。

表示速度の評価指標

表示速度は、PageSpeed Insightsで測定しました。

評価指標は以下の2つです。

表示速度の測定条件

表示速度の測定は、私が運営している別サイト（スムージーピュアライフ）で測定しました。

サイト概要と測定条件は、以下になります。

パフォーマンススコアの結果

上の表が高速化機能設定前と、設定後のパフォーマンススコアの測定結果です。

パフォーマンススコアは「モバイルで11.6点」「PCで13.8点」改善されました。

LCP(Largest Contentful Paint)の結果

上の表が、高速化機能設定前と、設定後のLCPの測定結果です。

LCPは「モバイルで2.4秒」「PCで0.4秒」改善されました。

フェニック

エックスサーバーの高速化機能凄いね！

エックスサーバーの高速化機能を利用するだけで、表示速度が大幅に改善します。

エックスサーバーでの高速化機能の設定方法

この項目では、表示速度を高速化させる手順を解説します。

エックスサーバーでは、以下の項目を設定することで表示速度が高速化します。

「Xアクセラレータ」「サーバーキャッシュ設定」「ブラウザキャッシュ設定」はデフォルトで高速化設定されています。

そのため、この3項目については概要だけ解説します。

PHPのバージョンアップによる高速化

PHPとは、サーバー側で動くプログラミング言語です。

PHPを最新バージョンに更新することで、WordPressの表示速度は向上します。

最新のPHPを使用することによって構築したサイトの表示速度が上がります。
速度が速いと検索エンジンにも高く評価され、検索結果の表示順位が上がる点も大きなメリットです。

引用：AROOM-そもそもPHPって何？

エックスサーバー導入時は、PHPは7.4に設定されています。

最新の8.1にバージョンアップしましょう。

STEP

Xserverアカウントから【サーバー管理】をクリック

STEP

PHPをバージョンアップさせるサーバーを選択

STEP

【PHP Ver.切替】をクリック

STEP

PHPのバージョンを8.1に設定

設定が完了したら【変更】をクリックしましょう。

これでPHPを、最新バージョンに変更できました。

JIT設定による高速化

JITとはPHP8.0より追加された「OPcache」の拡張機能です。

エックスサーバーでJIT設定する場合は、「php.iniファイル」を編集します。

JIT利用について

エックスサーバーでは提供中の全てのサーバーで「JIT」は標準で無効になっております。
有効化する場合は、「php.ini直接編集」メニューより編集してください。

引用：Xserver-JITについて

「php.iniファイル」の編集によるJITの設定方法

STEP

Xserverサーバーパネルから【php.ini設定】をクリック

• 編集するドメインを選択しましょう

STEP

【php.ini直接編集】をクリック

STEP

PHP.iniの最下部にコードを挿入

• 入力するコードは以下になります
• PHP.iniの最下部にコードを挿入してください

[JIT]
zend_extension = opcache
opcache.enable = 1
opcache.jit = on
opcache.jit_buffer_size = 128M

コードの挿入が完了したら【確認画面へ進む】をクリックします。

内容に問題がなければ【確定する】をクリックしましょう。

これでJITの設定は完了です。

XPageSpeed設定による高速化

XPageSpeed設定とは、エックスサーバーが開発したWebサイト最適化機能です。

エックスサーバーの高速化機能で、最も表示速度に影響を与えます。

WordPressを導入したら必ず設定しましょう。

XPageSpeedの設定方法

STEP

Xserverサーバーパネルから【XPageSpeed設定】をクリック

• 編集するドメインを選択しましょう

STEP

設定項目を全てONにする

ONにする設定項目

• 画像最適化
• 画像の遅延読み込み
• CSS最適化
• CSS遅延読み込み
• JavaScript最適化
• JavaScript遅延読み込み

設定が完了したら【確認画面へ進む】をクリックします。

内容に問題がなければ【変更する】をクリックしましょう。

これでXPageSpeedの設定は完了です。

WordPressのデザインを確認する

XPageSpeed設定を有効化することで、WordPressデザインが崩れることがあります。

設定後は、トップページと記事ページのデザイン崩れを確認しましょう。

フェニック

デザインが崩れたらどうするの？

Shota

項目を1つずつOFFにして「どの項目がデザイン崩れの原因なのか」を確認します。

ブラウザやサーバーコンテンツの内容によっては、本機能を有効とした際にWebサイトの表示が崩れるなど、 異なる動作となる場合が稀にあります。その場合は、本機能を無効に設定してください。

引用：Xserver-XPageSpeed設定について

全ての項目をONにする必要はありません。

デザインを見ながら問題がある項目については、設定をOFFにしましょう。

（参考）Xアクセラレータによる高速化

Xアクセラレータとは、エックスサーバーが開発したWebサイトの高速化機能です。

Xアクセラレータは、以下の方法で表示速度を高速化させます。

「Xアクセラレータ」はWebサイトを高速・安定化させるための機能です。
設定は以下のいずれかからお選びいただけます。

• Xアクセラレータ Ver.1 … 静的ファイルの高速化(キャッシュ)
• Xアクセラレータ Ver.2 … 静的ファイルの高速化(キャッシュ)＋PHPプログラムの高速化

引用：Xserver-Xアクセスレータ

フェニック

意味わからないんですけど。。。

Shota

意味が分かるように解説します。

静的ファイルのキャッシュ

静的ファイルとは、以下のものが対象です。

エックスサーバーでは、サーバー契約と同時に「XアクセラレータVer.2」がデフォルト設定されています。

そのため、Xアクセラレータの設定作業は不要です。

PHPプログラムの高速化

PHPとは、サーバー側で動くプログラミング言語です。

「Xアクセラレータ Ver.2」を利用することで、PHPプログラムの処理速度は最大20倍まで向上します。 

エックスサーバーでは、サーバー契約と同時に「XアクセラレータVer.2」がデフォルト設定されています。

そのため、Xアクセラレータの設定作業は不要です。

（参考）サーバーキャッシュ設定による高速化

サーバーキャッシュとは、読み込んだ情報を一時的にサーバーに保存する機能です。

Xアクセラレータによる高速化と機能は同じです。

エックスサーバーでは、サーバー契約と同時に「サーバーキャッシュ」がデフォルト設定されています。

そのため、サーバーキャッシュ設定の作業は不要です。

（参考）ブラウザキャッシュ設定による高速化

エックスサーバーでは、サーバー契約と同時に「ブラウザキャッシュ」がデフォルト設定されています。

そのため、ブラウザキャッシュ設定の作業は不要です。

エックスサーバーの高速化設定のまとめ

今回はエックスサーバーでの、高速化設定について解説しました。

さくっと内容を振り返ります。

エックスサーバーの高速化設定で、読者に優しいサイトを作りましょう。

今回は以上です！