こんにちは、南波真之と申します。
こちらの記事では、KUSANAGIユーザーが交流している、KUSANAGIユーザーフォーラムにあるトピックスをご紹介していきます。
このフォーラムには、KUSANAGIの基本的な使い方から、インストール時・運用時のお悩みまで、様々な投稿がされています。
KUSANAGIについて、わからないところがある方はぜひご参加ください。
今回は、表示高速化サービスであるWEXAL(ウェクサル)の最適化方法の調整についてです。サーバ側の高速化を行うKUSANAGIに加えて、表示側の高速化を行う仕組みがWEXALです。SEOでも注目されているCore Web Vitalsの対策も自動で行ってくれる、このWEXALについて見ていきます。
WEXALについて
WEXALとは、プライム・ストラテジーが開発提供しているWebサイトの表示を高速化する仕組みです。
公式サイト:WEXAL
WEXALでできること
WEXALを利用することで、以下のような高速化が実現できます
- 画像の最適化(WebP、JPEG2000、JPEG XRといった次世代画像フォーマット化)
- CSSやJavaScriptの最適化
- ファーストビューを速く表示させるためのCSS/JavaScriptの実行順序制御(Engagement Delay)
- 適用サイトの各ページを自動でチェックし、WEXAL搭載のAIが最適な表示方法を判断し適用
つまり、現代で必要なWebの高速化対策が自動で実現できるようになるというものです。
また、上記をブラウザから制御する仕組み(PST Manager)も提供していますので、エンジニアでなく、Web担当者での運用も可能です。
Engagement Delayとは
WEXALでできることの中で、今回はEngagement Delayについて見ていきます。Engagement Delayとは、Webページのコンテンツに含まれるJavaScriptの実行やCSSのロードを、サイトに訪問してきた人のサイトへのエンゲージメントに応じで遅延制御をさせる仕組みです。
例えば、初めてそのページに訪れた訪問者の場合は、ファーストビューを真っ先に表示させることで直帰や離脱のリスクを下げ、回遊率を上げることができます。
初めて見たページでいつまで経っても表示がされないというほどイライラする事はありません。
しかし、何度もページに訪れている訪問者の場合は、エンゲージメントが高いため、ファーストビューの速度にそこまでシビアでない傾向があります。その場合は、本来のサイトの表示順で表示させても問題ないということになります。
このように、ユーザー視点に立って表示を自動で調整させる仕組みがEngagement Delayです。
WEXALのビジネスへのインパクト
WEXALを活用することで、Webサイトの高速化が実現でき、Googleが提唱しているCore Web Vitalsの改善ができることは先程取り上げました。
これが、どれだけのビジネスインパクトをもたらすのかについては、GoogleのDevelopers Blogに良い記事が出ています。
この記事の中で日本の事例が1つありましたので、紹介します。
Yahoo! Japan は、パフォーマンスの低いページの CLS を修正して 98% 削減することで、セッションあたりのページビューが 15% 増加
このようにCore Web Vitalsを改善することで、ページビューや収益に影響があるという良い事例がいくつも載っていますので、ぜひご覧ください。
<寄せられたご質問
こんにちは。
KUSANAGI+Wexal上のWordpressサイトを運営しています。
私が使用しているプラグインの一つにAutoptimizeがあるのですが、どうにもデザインが崩れてしまうので、こちらが生成するcssだけをWexalのengagement delay処理の対象から除外したいと考えております。
しかしPST Managerの「engagement delay の適用方針」メニューを参照すると、ページソース内にて検知されたファイルのURL群から個別にON/OFFできる機能しかないようです。
————————————————–
<寄せられたご質問への回答>
こんにちは。
PST ManagerからURLを指定してdelayから除外する方法はなさそうです。
力技になってしまいますが、pst.config.yamlのファイルを直接編集する方法ならあります。
試しに1つ何か「/wp-content/cache/autoptimize/css/ほげほげ.css」を除外して、本番化してみてください。
(続きは以下を御覧ください)
engagement delayの除外ファイルをディレクトリ単位で指定できますか?
————————————————–
Engagement Delayの調整に関しては、ブラウザ側のPST Managerから実施する方法とサーバ内の設定ファイルを編集する方法があります。
実施されたい状況に応じて、対応ください。
KUSANAGIに関する質問や課題を持つ方は、ユーザーフォーラムに投稿いただくか、KUSANAGI公式サポートサービスのご利用をご検討ください。
また、お仕事やプライベートでKUSANAGIを使っている、という方はぜひフォーラムの質問への回答者としてもご参加ください!
ユーザーフォーラムが活性化していくとよりKUSANAGIが盛り上がっていくと思います。
皆様のご参加をお待ちしております。