サイト高速化AI「WEXAL」をインストールする手順【2024年9月15日修正】

本稿ではWEXALのインストールする手順について記します。
私自身が躓いたこと・悩んだことについても記していますので、他サイトより実践的に読めると思います。
記事を読む前提として、既にKUSANAGI環境は構築されているものとします。

【2024年9月15日改稿】
KUSANAGI8と9の違い、WEXAL最新バージョンの設定に一部対応。

天満川鈴 WRITTEN BY 天満川鈴

アップグレードする前にやること

DocumentRoot直下のファイルはバックアップをとっておく

KUSANAGI Premium Editionへアップグレードした際に、自分で追加したファイルが消える可能性があります。
(KUSANAGI8の場合。KUSANAGI9は未確認ですがトラブルは特に生じてないです)

私のケースですと、

  •  ログインページ用のPHPファイル
  • wordefenceのファイル

なぜかadsense用のads.txtは残っていました。

いずれにせよ、KUSANAGIを使っているなら自動バックアップの設定をしておくのが間違いありません。

設定ファイル(.conf)のバックアップをとる

設定ファイルはローカルにフォルダごとバックアップした方がいいです。
(一応、WEXALの側でバックアップをとってくれます)

KUSANAGI8のフォルダの場所は、

/etc/nginx/conf.d

KUSANAGI9のフォルダの場所は、

/etc/opt/kusanagi/nginx/conf.d

設定ファイル(.conf)の記述を元に戻す

【プロファイル名】_ssl.confは、変更を加えているなら元に戻してください(KUSANAGI8の場合)

私の場合はwebp配信の設定をしていたところエラーになりました。
(SSLそのものがおかしくなった)

KUSANAGI9では不明ですが、元に戻しておくに越したことはないと思います。

 

テーマとプラグインの高速化機能は全て切る

CocoonやLuxeritasではHTMLの縮小化・CSS・JSの縮小化などの高速化機能があります。
ですが、

テーマの高速化機能は全て切ります

全てWEXALがやってくれます。
機能が被るので無駄ですし、誤作動やトラブルの元になります。

WEXALはCSS・jsの結合をしません。
だったら、これだけは残してもいいのではないか?

答えはNOです

一般的にHTTP/2以降では分割したままの方が速いです。

同時並行でリクエストを処理するからね

詳しい説明はカゴヤさんのページがわかりやすいです。

各ファイルのサイズによって結合した方がいい悪いはあるでしょうが。
(例えばコードが一行だけのファイルとか)
全て一つにまとめてしまった場合、PageSpeed Insightsの指標はがくんと落ちます。

ConoHaにおけるWEXALへのアップグレード方法

以下、ConoHaの例となります。

ライセンスの購入(登録)

ConoHaにログインし、サーバー→ネームタグ→アップグレードを押します。

右端のパーソナルライセンスを選びます。
法人の場合は無料利用できませんので御注意ください。

premiumを選んで、カートに入れます。

「お支払いへ進む」を押します。

必要事項を入力して「注文する」を押します。

完了画面が出たら、上部の「マイアカウント」を押します。 (支払完了の時点でログイン状態になってると思います)

サブスクリプションキーを控えます。

ターミナルからアップグレードする

ConoHaのWEXAL導入ページを開きます。 (ここまでの流れは、導入ページで省略している部分を記したものです)

「アップグレードライセンスの購入について」の[4]まで進みます。

[4] KUSANAGI Marketplaceにてライセンス購入が完了しますとサブスクリプションキーが有効になるので、サブスクリプションキーを確認の上VPSへコンソール画面やSSH接続にてログインします。

※サブスクリプションキーについてはKUSANAGI Marketplaceのマイアカウントのダッシュボードにて確認が出来ます。

(引用:ConoHa公式「ご利用ガイドKUSANAGI WEXALを導入する」)

root権限のユーザーでログインし、次のコマンドを入力します。

# kusanagi upgrade kusanagi --edition business|premium --use production|staging|development|personal --key xxxx-xxxx-xxxx-xxxx

このまま打ってはいけません。 私と同じタイプ(premiumかつ個人)と仮定すると、次の通りになります。

# kusanagi upgrade kusanagi --edition premium --use personal --key xxxx-xxxx-xxxx-xxxx

キーは先程のサブスクリプションキーです。

購入したエディションをインストールします。

# yum install kusanagi-biz|kusanagi-prem

もっとも、多くの場合がPREMIUMエディションでしょう。
次のコマンドでOKです。

# yum install kusanagi-prem

WEXALの有効化

以下、rootになっていることが前提です。
次の順にコマンドを叩いていけばOKです。

# yum update kusanagi-prem
# pst init (アカウント名)
# pst on (アカウント名)

URLが出ますので確認しておいてください。
最後にWEXALが起動しているか、確認します。

# pst status (アカウント名)

PSTの設定

PST Managerのポートを開ける

最初にPST Managerで基本的な設定をします。

PST Managerを使うにはポート61000を開ける必要があります

具体的には、KUSANAGIのファイアウォール設定を変更してポートを開けます。
KUSANAGI9ですとデフォルトでファイアウォールがオンになっていると思います。
念のため、次のコマンドで確認してみてください。

# systemctl is-enabled firewalld.service

ファイアウォールの自動起動を確認するコマンド。
恐らくenabledと出るはずです。

ポートを開けます。
ターミナルから次のコマンドを打ち込んでください

# firewall-cmd --add-port=61000/tcp --zone=public --permanent
# firewall-cmd --reload

設定を確認します。

# firewall-cmd --list-all

これで繋がらない場合、VPSの設定を確認します。
ConoHaでしたら「接続許可ポート」につき「全て許可」がデフォルトです。
もし自分で変えていたら戻してください。

コントロールパネル→サーバー→(該当サーバー)の詳細情報→ネットワーク情報→接続許可ポートを確認。
全てオンか確認します。

PST Managerのユーザーとパスワードを設定する

ターミナルからPST Managerのユーザーとパスワードを設定します。

# pst passwd --user 【ユーザー名】 --pass 【パスワード】

PST Managerにログインする

pst initの後に表示されたURLへアクセスします。
ユーザー名とパスワードを入力し、ログインします。
ログインできることを確認できたらターミナルへ戻ります。

なお、次項の作業はPST Managerでもできますが避けた方が無難です。

重いので

ターミナルから設定を行う

次のコマンドで最適化を開始します。

# cd /home/kusanagi/【プロファイル名】
# pst opt all

あるいは、

# pst opt all 【プロファイル名】

しばらく待ちます。
画像の量によっては数時間掛かります。
終わっても表示は出ません。

時間をおいてサーバーのリソース利用状況を確認。
(ConoHaならコントロールパネルから見られます)
落ち着いた様子なら次のPSTコマンドを叩きます。

 # pst queue

次の表示が出れば作業が終わっています。

optimizer = 0
strategy = 0
queue completed.

終わったら、念のためキャッシュを削除します。

# kusanagi pst bcache clear 【プロファイル名】
# kusanagi pst fcache clear 【プロファイル名】

AIに最適化を命じます。

# pst config crawl --url 【サイトURL】 --depth 3 【プロファイル名】

depthオプションはデフォルトだと2です。
全ページの最適化をするなら3以上を入れます。
(以前のai configコマンドはなくなっています)

再度、確認コマンドを打ち込みます。

# pst queue

「strategy = 0」になっていたら完了です。

pst optとcrawlは同時並行できます。
しかし、

どちらのコマンドも重いので別々にやることを推奨します

別々にやってすら2GBプランではサーバーが頻繁に落ちます。
(環境とタイミング次第とは思いますが)

圧縮プラグインを解除してサムネイルを作り直す

WEXALで画質が劣化した場合の対策

私の環境の問題かもしれませんが……。
最初に画像最適化したときは見られたものじゃない画質でした。
そのためサムネイルを作り直したところ、ちゃんとした画質で表示されるようになりました。

原因としては①何度かの入替で元画像の画質が劣化していた②再圧縮されてしまった。
どちらの理由にしてもですが、

①KUSANAGI画像プラグインを使っている場合、画質を「100」(圧縮しない)にする
その他のプラグインならアンインストールする
②①の上でサムネイルを作り直す

画像関係の処理はWEXALに任せてしまいます。
あえてKUSANAGIプラグインをオンにするメリットは画像の最大幅サイズ調整ができることにあります。

KUSANAGIの場合はWP-CLIを使った方がプラグインよりサムネイル再生成が速いです。

画質をいくつにするか決めておく【2024年9月15日改稿】

現在のデフォルト画質は80になっています。
ConoHa公式にも書いています。

画像を最適化する際の圧縮率を1~100の間で設定できます。
数値が1に近いほど、圧縮率が高くなり、画像の解像度が落ち、100に近いほど圧縮率が低くなり、元データに近い状態になります。
なお、圧縮レベルの推奨値は「80」となります。

引用:ConoHa公式「WEXALについて」

一般的な数値なので変更しなくてOKです。

以前は60でした。
PCやスマホの高解像度化が進んだため変更したものと思われます。

画像の最大サイズをコンテンツ幅に合わせておく

PageSpeed InsightsにおけるLCPを下げるためです。
(指摘される画像は、ほぼアイキャッチ)

既に登録している画像はプラグイン「imsanity」で変更できます。

今後入れる画像はKUSANAGIの画像最適化機能でサイズを設定しておくと調整してくれます。

(Cocoonの場合)Retina対応のチェックを外す

画像サイズは少しでも小さい方がいいですから。
ただ、ここは各人の好みと信条です。

画像の表示崩れがないか確かめる

サイトの表示崩れがないか確認します。
もし生じていた場合はWEXALをオフにします。

# pst off プロファイル

これで表示が直ればWEXALが原因です。
トラブルと対処法の一例としては、こちらをあげておきます。

まとめ

これで終わりです。
あとはWEXALの仕様変更がない限り、アップデートを随時行うだけでOK。
この点はプラグインと同じです。

導入のコツは、WEXAL入れる前にサイト環境をしっかり固めておくことです。
途中でも述べた画像の画質・サイズ・サムネイルの構成などは予め決めておく。
高速化関係のカスタマイズは真っさらにする。

導入の際は色々と手がかかりますが、これは他の高速化プラグインでも同じです。
その分入れてしまったら、あとは楽になります。

頑張ってください

天満川 鈴のプロフィール画像
WRITTEN BY

天満川 鈴

未経験からWEB業界に入り、現在はWEBディレクターとして実務に従事。 要件整理・導線設計・コンテンツ構成などを学びながら、日々改善を重ねています。 AIを活用したコンテンツ制作・効率化を強みとし、プロンプト設計を含めた制作フローの最適化にも取り組んでいます。
本サイトでは、WordPressやサイト制作に関する試行錯誤・検証内容を中心に発信。 技術検証の一環として、KUSANAGI公式サイトにて記事を2回紹介いただきました。

RECOMMENDED INFRASTRUCTURE

私はConoHa以外を勧めない。

2016年からずっとConoHaを使い倒してきました。知人に「一番いいサーバーは?」と聞かれたら、迷わずここを教えます。

レンタルサーバーナンバーワンを誇る高速環境であることはもちろん。私が「黒い画面って何?」というド素人からサイト制作のプロになれたのは、傍らにずっとこのはちゃんがいてくれたから。
私がConoHaを使い続ける、嘘偽りない理由です。

※ConoHaに初めて入会の方限定。
本CTAの画像もしくはボタンを押してWINGパック12か月以上を契約すると、最大5000円割引してもらえます。

公式サイトで詳細を見る
× 閉じる