「ABテストツールを入れると、ページ速度は遅くなりますか？」
これは多くの企業様からいただくご質問です。
結論から言えば、ページ速度に影響はしますが、適切に対処を行えば、その影響を支障のないレベルまで小さくすることができます。 だからこそツールの導入自体には問題がないと、弊社のお客様のみならず、世界中のウェブマスターがそのように判断しているわけです。では、
その方法が具体的にどういったものなのか？ 本記事でご説明します。
かつて世界で最も利用者の多いABテストツールだったGoogleオプティマイズは、2023年9月30日をもって提供終了となりました。
それから約3年が経ち、代替ツールへの移行も多くの現場で一巡しています。さらに2026年1月には、有力ツールであるAB TastyとVWOが統合を発表するという大きな動きもあり、ABテストツールをとりまく市場環境はこの数年で大きく変化しています。
こうした状況を踏まえ、今回はツール導入時に行う一般的な表示速度対策に加え、ツールごとの対策の違いについても解説します。これからABテストツールの導入を検討している方はもちろん、すでに活用が進んで表示速度が気になり始めた方もぜひ参考にしてください。
目次
サイト管理者が「ページ表示速度」を気にする理由
そもそもなぜ「ページ表示速度」を気にする方が多いかというと、理由は2つあります。
1つ目は、CVRに影響を与えるためです。
経営コンサルティング企業大手のDeloitte社は、2020年に発表したレポート「Milliseconds make Millions」のなかで以下のように述べています。
モバイルサイトにおける 0.1秒の表示速度改善が、コンバージョンとエンゲージメントに、以下の改善をもたらした。
- 小売業では、CV数が8.4％、平均注文額が9.2％増加した
- 旅行業では、CV数が 10.1％、平均注文額が 1.9％増加した
- ラグジュアリーブランドでは、セッションあたりPV数が 8.0%増加した
- すべての業種で、PV数、CVR、平均注文金額がポジティブに変化した
引用：Deloitte社「Milliseconds make Millions」
このように、表示速度はコンバージョンと密接な関わりを持っています。CVR改善のためにABテストツールを入れるのに、ツールを入れたせいでCVRが悪化してしまっては本末転倒ですから、気にされるのは当然でしょう。
もう1つは、Google検索のランキング要素に「表示速度」が使われているためです。
Googleは検索ランキングの評価基準に「Core Web Vitals（コアウェブバイタル）」と呼ばれる指標群を導入しており、ページの表示速度や操作への応答性がSEOに直接影響します。現在のCore Web Vitalsは以下の3指標で構成されています（2024年3月に指標が改訂され、FIDに代わりINPが採用されました）。
- LCP（Largest Contentful Paint）：ページのメインコンテンツが表示されるまでの時間
- INP（Interaction to Next Paint）：ボタンやリンクへの操作に対するページ全体の応答性
- CLS（Cumulative Layout Shift）：読み込み中のレイアウトのずれ
特に、自然検索流入を重視しているサイトでは、主要なキーワードでランクが1つ下がるだけで大幅に売上が減ることもあります。ABテストツールのJavaScriptタグのような、短期的にはSEOに何のメリットももたらさないものをページに差し込むのは、良い気がしないはずです。
これらのことはABテストツールのベンダーももちろん気にかけており、下記のように各社それぞれが対策に磨きをかけて、表示速度に問題がないことをアピールしています。（※弊社ホワイトペーパー「ABテストツール比較表」から抜粋）
今回はその中から、代表的なものと、特徴的なものを合計4つピックアップしてご紹介します。
タグは、タグマネージャー経由ではなく直書きで入れる
「タグマネージャーでタグを入れられますか？」
これも非常によくいただく質問です。結論としては可能ですが、おすすめはしてません。
タグマネージャー経由でABテストツールのタグを配信すると、「ページフリッカー（ちらつき現象）」が発生しやすくなります。これは、テストパターンの読み込みが遅れることで、変更前のオリジナルパターンが一瞬チラ見えしてしまう不具合です。
なぜこの問題が起きるかというと、タイムラグの仕組みにあります。オリジナルの要素はページの読み込みが開始した直後からすぐに描画を開始します。一方、タグマネージャー経由のテストパターンの変更内容は、タグマネージャーのタグとABテストツールのタグの両方が読み込みを完了した後で、はじめて適用されます。この二段階の読み込みが、不快なちらつきを生んでしまうのです。
上記は、左が Googleオプティマイズのタグをタグマネージャー経由で配信したテストの様子。右が、Googleオプティマイズのタグを直書きで設置したテストの様子です。
左側（GTM経由）中央のイラスト画像が表示される前に、1秒ほど別の画像が見えているのが分かりますでしょうか。これは、テストパターンの読み込みが遅れることにより、変更前のオリジナルパターンがチラ見えしてしまう不具合で、「ページフリッカー（ちらつき現象）」と呼ばれています。
一方、右側の直書きで設置しているほうは、ちらつきは全く発生していません。
テストパターンの読み込みが遅れる原因は複数ありますが、最も多い原因がこの「タグマネージャー経由のタグ配信」です。
直書きで設置すれば、ABテストツールのタグはページの読み込み直後から機能しちらつきを防ぐことができるため、覚えておきましょう。
同期タグ・非同期タグを、テスト内容に応じて切り替える
ABテストツールのタグには「同期タグ」と「非同期タグ」があり、適切な使い分けが重要です。
「同期」というのは色々な意味で使われる言葉ですが、ここでは「他の要素とは同時に読み込まれない」という意味で使われています。
その言葉通り、同期タグは変更内容の読み込みが完了するまでオリジナルの描画を待機させます。そのためちらつきは発生しませんが、その分ページ全体の読み込みがわずかに遅くなるというトレードオフがあります。非同期タグはページ全体の読み込みを妨げず速度への影響は最小限ですが、ちらつきが発生するリスクを持ちます。
それぞれの特性をまとめると、以下のようになります。
| 同期タグ | 非同期タグ | |
| ちらつき | 発生しない | 発生することがある |
| ページ速度への影響 | わずかに遅くなる | 影響が小さい |
| 向いているテスト箇所 | ファーストビュー・ヘッダーなど | スクロール下部・フッターなど |
この特性を踏まえた最も適切なタグの使い方は、「テスト内容に応じて同期・非同期を切り替えること」になります。AB Tasty・VWO・Optimizelyのいずれも、同期・非同期を選択して設置することができます。
中でもOptimizelyは、スニペット全体を同期で読み込みつつ、テスト内の個々の変更要素ごとに非同期への切り替えが可能です。たとえばファーストビューの変更は同期、スクロール下部の動画など重い要素は非同期、という細かい使い分けができるため、速度とちらつき防止を両立しやすい設計になっています。
ただ、実際には冒頭でお伝えした「タグマネージャー経由での配信」ほど、同期・非同期の選択で差が生じるケースは多くありません。環境によっては差が大きくなることもあるため、特性を理解したうえで設置することは忘れないようにしましょう。
CDNを最適化する（セルフホスティング）
ABテストツールのタグは通常、ベンダーが管理するCDN（コンテンツ配信ネットワーク）経由で配信されています。
CDNとは何かを簡単にいうと、ファイルを一時保管（キャッシュ）するサーバーを世界中に分散配置することで、ユーザーに近い場所からファイルを届ける仕組みです。物理的に離れたサーバーからファイルを受け取ると通信に時間がかかりますが、CDNを使うことでその遅延を大幅に減らすことができます。
突然ですが、海外のWebサイトを閲覧したときに「表示が遅いな」と感じたことはありませんか？ あの現象は、ファイルが遠くのサーバーにあり、そこにたどり着くまでに経由する機器の数が多くなることによって起こります。CDNはまさにその問題を解決するための仕組みです。
主なABテストツールのCDN対応状況は以下の通りです。なお、AB TastyとVWOは2026年1月に統合を発表しており、今後のCDN対応状況については各社の公式情報をご確認ください。
- Optimizely：Fastly・Cloudflare・Akamai・Amazon CloudFrontなど複数のCDNに対応（Performance EdgeはCDN非依存で動作可能）
- VWO / AB Tasty（統合後）：統合後の詳細は公式情報を要確認
下の画像を見て下さい。VWOのタグ発行をする画面をキャプチャしたものですが、タグのドメイン名が yourdomain.com となっているのが分かりますでしょうか。
ここで「セルフホスティング」についてお話します。セルフホスティングとは、ツールベンダーが管理するサーバーではなく、自社の管理するサーバーにツールタグのJavaScriptファイルを設置できる機能です。
なぜそんなことをするのかというと、目的は主に2つあります。1つはパフォーマンスの向上です。
なぜそんなことをするのかというと、目的は主に2つあります。1つはパフォーマンスの向上です。自社がすでにCDNを使ってWebサイトを配信している場合、ABテストツールのスニペットも同じ配信環境にまとめることで、ベンダーのサーバーへの接続に伴う余分な通信コストをなくし、読み込みをより速くすることができます。もう1つはセキュリティポリシーへの対応です。
社内のセキュリティポリシー上、外部サーバーからのサードパーティJavaScriptの読み込みが難しいケースでも、セルフホスティングであれば要件を満たせることがあります。
セルフホスティングを用いるとツールの一部機能が使用できなくなることがある点には注意しましょう。ツールによって制限される機能が異なりますので、実施前に各ツールの公式ドキュメントで仕様をよく確認した上で進めることをおすすめします。
Optimizely の「Performance Edge」を使う
最後はOptimizely限定のソリューション「Performance Edge」の活用です。これを用いると、ABテストツールにおいて懸念される読み込み速度の低下、画面のちらつき、SEOへの影響を極限まで小さくすることができます。
その具体的な内容は、通常はユーザーのブラウザ側で行うターゲティングとトラフィックの分配の処理を、CDN上のエッジサーバーで前もって行うというものです。各ユーザーには必要最小限のJavaScript（マイクロスニペット）だけが返されるため、ブラウザ側の処理が大幅に軽くなり、ABテストツールに起因する速度低下やちらつきを大幅に抑えることができます。
AB TastyやVWOでもサーバーサイドやエッジを活用した実装は技術的に可能ですが、いずれもカスタム開発が前提となります。Performance Edgeのように、管理画面から設定するだけでCDNエッジ処理に切り替えられるパッケージとして提供されているのは、現時点ではOptimizelyのみです。
自社サイトのパフォーマンス計測には、Chrome DevToolsに標準搭載されているGoogleの診断ツール「Lighthouse」が便利です。追加インストールなしでブラウザの検証ツールから利用でき、Speed Indexなどの指標でページの表示速度を確認することができます。Google公式もChrome DevTools経由での利用を推奨しています。
導入にはエンジニアの工数がある程度必要で、他の方法と比べるとハードルは高めですが、ABテストの活用本数が増えてきた段階で表示速度への影響が気になり始めたら、そのタイミングで導入を検討するのがおすすめです。
まとめ
以上の内容を優先度順に整理すると、次のようになります。
- タグの直書き（必須）：タグマネージャー経由を避けることが、ページフリッカー防止の最重要ポイント
- 同期・非同期タグの使い分け：テスト対象の場所に応じて適切に選択する
- セルフホスティング：パフォーマンス向上やセキュリティポリシー対応が必要な場合の選択肢
- Performance Edge（Optimizely）：テスト活用が本格化した段階での上位対策
まずタグの直書きは最低限の対策として必ず行い、それ以外については状況に応じて必要な対策を組み合わせていくのが基本的な考え方です。テストパターンの画像を軽量化する、不要なJavaScriptを削除するといった、ツール以前の基本施策も並行して取り組むことが重要です。
ABテストツールをとりまく市場は、Googleオプティマイズの終了やAB TastyとVWOの統合など、この数年で大きく変化しています。ツールを選ぶ際には機能や価格だけでなく、表示速度対策の充実度も重要な評価軸の一つに加えることをお勧めします。
導入や各機能についてご興味のある方は、こちらのページからお気軽にお問い合わせください。
