【ネットワーク】CDN

Posted at 2025-04-27

はじめに

こんにちは。アメリカに住みながら、独学でエンジニアを目指しているTairaです。

現在インターネットの知識の確認するインターネットクイズを定期的にやっているのですが、そこで出てきたCDNについて説明していきたいと思います。

CDN（Content Delivery Network）は、Webサイトのコンテンツ（画像、JS、CSSなど）を世界中のユーザーに高速・安全に配信するための分散型ネットワークです。世界各地に配置されたエッジサーバーを通じて、ユーザーの近くからデータを届ける仕組みです。

CDNは、モダンなWebアプリ開発においてインフラの一部として不可欠な存在です。以下の理由から、ソフトウェアエンジニアにとってCDNの理解はとても重要です。

表示速度とユーザー体験の向上：ページ表示が早くなることでUXが改善され、直帰率の低下やコンバージョン率の向上が期待できます。
スケーラビリティの確保：トラフィックが集中してもCDNが分散して処理するため、アプリ全体の耐久性が高まります。
グローバル対応：海外ユーザーにも快適に利用してもらうためには、エッジサーバーを通じた配信が不可欠です。
セキュリティと可用性の強化：DDoS攻撃の緩和やWAF（Web Application Firewall）との連携によって、信頼性の高いサービス提供が可能になります。

RailsやRails + Reactの開発では、以下のような場面でCDNが活用されます：

以下の点を押さえておくと、CDN導入時に混乱せずに済みます。

RailsやReactでビルドした静的ファイルは、CDNが読み込める場所（例：S3など）に配置する必要があります。

Railsでは config.asset_host にCDNのURLを指定することで、出力されるタグがCDN経由になります。

ファイル名にハッシュを付けることで、CDNに古いファイルが残る問題を防ぎます（Railsは自動で対応）。

ReactとRails APIを組み合わせる場合、オリジンが異なるとエラーになるため、CORSの設定が必要です。

[ユーザー]
     ↓
CloudFront（CDN） ← JS/CSS/画像 → S3
     ↓
Railsサーバー（動的処理） ← API → DB

CDNを活用することで、Webアプリケーションのパフォーマンス、スケーラビリティ、セキュリティを大幅に向上させることが可能です。特にRailsやReactのようなモダンな技術を使った開発では、初期の段階からCDNの設計を意識することで、以下のようなメリットを享受できます。