Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【ITニュース解説】2週間のインターンで SSR・CDN 環境下での A/B テスト基盤を構築してみた

2025年09月27日に「Zenn」が公開したITニュース「2週間のインターンで SSR・CDN 環境下での A/B テスト基盤を構築してみた」について初心者にもわかりやすく解説しています。

作成日: 更新日:

ITニュース概要

サイバーエージェントのインターンで、Webチームが実働9日間でA/Bテスト基盤を構築。これは、サーバー側でページ生成し高速配信するSSR・CDN環境で、複数デザインを試し効果を測る仕組みを作った経験だ。

ITニュース解説

システムエンジニアを目指す皆さんにとって、実際の開発現場での経験は非常に貴重だ。今回紹介する記事は、まさにそのような実践的な学びの機会に挑んだ学生の体験談だ。株式会社サイバーエージェントのインターンシップで、短期間のうちに「SSR・CDN 環境下での A/B テスト基盤」を構築するという、非常に専門的で実践的な課題に取り組んだ事例について解説する。

まず、記事の核となる「A/Bテスト基盤」について説明しよう。A/Bテストとは、ウェブサイトやアプリケーションの改善において非常に重要な手法の一つだ。例えば、ウェブサイトのボタンの色や配置、見出しの文言など、ユーザーインターフェースのわずかな変更が、ユーザーの行動にどのような影響を与えるかを検証するために用いられる。具体的には、元のデザイン(Aパターン)と変更を加えたデザイン(Bパターン)を、それぞれ一部のユーザーにランダムに表示し、どちらが目標とする成果(例えば、商品の購入率や問い合わせ数など)をより多く達成するかを比較する。このテストによって、感覚や推測ではなく、データに基づいた客観的な改善策を見つけ出すことが可能となる。A/Bテスト基盤とは、このA/Bテストを効率的かつ正確に実施し、その結果を分析するためのシステム全体を指す。

次に、「SSR(Server Side Rendering)」と「CDN(Content Delivery Network)」が何を意味し、なぜA/Bテストと組み合わされるのかを見ていこう。

まずSSR、サーバーサイドレンダリングとは、ウェブページをブラウザに表示する際の方法の一つだ。皆さんがウェブサイトにアクセスすると、ブラウザはサーバーからHTML、CSS、JavaScriptなどのファイルを受け取り、それらを組み合わせてページを組み立てて表示する。特にJavaScriptを多用するモダンなウェブアプリケーションでは、ブラウザ側でJavaScriptを実行して初めてページのコンテンツが表示される、いわゆるクライアントサイドレンダリング(CSR)が主流になることもある。SSRはこれとは異なり、サーバー側でHTMLファイルを事前に生成してからブラウザに送信する方式だ。この方式のメリットは大きく二つある。一つは、ページの初期表示速度が速くなることだ。ブラウザが受け取る時点で既に完成されたHTMLが用意されているため、ユーザーはすぐにコンテンツを見ることができる。もう一つは、検索エンジン最適化(SEO)に有利な点だ。検索エンジンのクローラーは、サーバーから送られてくるHTMLを読み取ることでコンテンツを認識するため、SSRは検索結果での表示されやすさに貢献する。

次にCDN、コンテンツデリバリーネットワークとは、ウェブサイトの高速化と安定稼働に不可欠な技術だ。ウェブサイトで使われる画像、動画、JavaScriptファイル、CSSファイルなど、静的なコンテンツをユーザーに届けるための仕組みである。CDNは、これらのコンテンツを世界中に分散配置された複数のサーバーにキャッシュ(一時的に保存)しておく。ユーザーがウェブサイトにアクセスした際、CDNはユーザーに最も近いサーバーからコンテンツを配信する。これにより、たとえ遠隔地のサーバーに元のウェブサイトが置いてあっても、ユーザーは高速にコンテンツを受け取ることができ、ウェブサイトの表示が劇的に速くなる。また、元のサーバーへのアクセス集中を防ぎ、負荷を分散させる役割も果たすため、ウェブサイトの安定稼働にも寄与する。

このインターンシップで構築された「SSR・CDN 環境下での A/B テスト基盤」は、これら三つの技術を組み合わせた高度なシステムだ。具体的には、SSRによって高速かつSEOに強いウェブサイトを提供しつつ、CDNでさらにそのコンテンツを世界中のユーザーに高速に配信する環境で、データに基づいた効果測定と改善を行うA/Bテストを実行できるシステムを構築したということだ。A/BテストをSSR環境下で実施する場合、テストの分岐をサーバーサイドで行う必要がある。つまり、ユーザーがアクセスした時点で、サーバーがどのテストパターン(AかBか)を表示するかを決定し、それに応じたHTMLを生成してブラウザに送る必要があるのだ。これにより、クライアントサイドでのJavaScriptの実行を待つことなく、初期表示の段階からテストを適用できる。これは、特に初期表示が重要なランディングページなどで効果を発揮する。そして、CDNは、テストによって生成された異なるバージョンのコンテンツも効率的にキャッシュし、ユーザーに素早く届ける役割を担う。

このインターンシップは、わずか2週間、実質9日間の非常にタイトなスケジュールで行われた。この短期間で、これらの技術を理解し、実際に動く基盤を設計し、実装するというのは、システムエンジニアを目指す初心者にとっては計り知れない挑戦だったはずだ。限られた時間の中で、既存のコードベースを理解し、新しい要件を分析し、技術的な課題を解決しながら、システムを構築していくプロセスは、まさに実際の開発現場で求められるスキルと経験そのものだ。記事からは、定例ミーティングやランチを通じてチームメンバーと密接にコミュニケーションを取りながら、課題を乗り越えていった様子がうかがえる。このような実践的な経験は、技術力だけでなく、問題解決能力、コミュニケーション能力、そして何よりも「動くものを作る」というエンジニアリングの醍醐味を教えてくれるだろう。

このインターンシップの経験は、単に特定の技術を習得しただけでなく、現代のウェブ開発がいかに多様な技術と目的が複雑に絡み合っているかを示している。高速なパフォーマンス、優れたユーザー体験、効果的なマーケティング、そして安定した運用、これらすべてを考慮してシステムを構築する必要がある。システムエンジニアを目指す皆さんにとって、このような実例は、将来どのようなスキルを身につけ、どのような視点を持って開発に取り組むべきかを考える上で、大きなヒントになるはずだ。この経験は、技術の表面的な理解に留まらず、その技術がなぜ必要とされ、どのようにビジネスに貢献するのかという本質を学ぶ貴重な機会となったことだろう。

関連コンテンツ

関連IT用語