AWS の CloudFront でコンテンツ圧縮！パフォーマンス向上のためのヒント

AWS の Amazon CloudFront は、コンテンツ配信ネットワーク（CDN）として、Web サイトやアプリケーションのコンテンツを世界中のユーザーに高速・安全に配信することができるサービスです。

そんな CloudFront の機能の一つに、コンテンツ圧縮機能があります。

本ブログでは Amazon CloudFront のコンテンツ圧縮機能について、その仕組みやメリット、圧縮できないファイルの種類などを解説していきます。

なぜコンテンツ圧縮するのか

コンテンツ圧縮をすることで以下のようなメリットがあります。

ネットワーク帯域幅の節約：
圧縮されたコンテンツは元のサイズよりも小さいため、ネットワークを介して転送するデータ量が減り、帯域幅を節約できます。
ページの読み込み速度の向上：
読み込むデータ量が減ることで、ページの読み込み時間が短縮され、ユーザーの待ち時間を減らすことができます。
コスト削減：
データ転送量を減らすことで、 AWS のデータ転送料金を削減できます。

AWS で使える Amazon CloudFront のコンテンツ圧縮機能とは

Amazon CloudFront のコンテンツ圧縮機能は、HTTP リクエストのヘッダーに Accept-Encoding が含まれている場合、CloudFront が自動的にコンテンツを圧縮し、クライアントに配信する機能です。

使用される圧縮方式は、gzip と Brotli です。

gzip：広くサポートされている一般的な圧縮方式です。
Brotli：gzip よりも高い圧縮率を実現できる新しい圧縮方式です。

コンテンツ圧縮機能の仕組み

Amazon CloudFront のコンテンツ圧縮機能は、リクエストヘッダーとキャッシュという 2 つの要素を基に、コンテンツを圧縮し、配信しています。

リクエストヘッダーの役割 ─

Accept-Encoding：
クライアントがサポートする圧縮方式を CloudFront に通知するヘッダーです。一般的に gzip や Brotli が指定されます。CloudFront は、このヘッダーの内容に基づいて、どの圧縮方式でコンテンツを配信するかを決定します。

キャッシュの仕組み ─

キャッシュヒット：
クライアントから同じリクエストが来ると、CloudFront はキャッシュに保存されている圧縮済みのコンテンツを直接返却します。
キャッシュミス：
キャッシュに該当コンテンツがない場合、CloudFront はオリジンサーバーからコンテンツを取得し、指定された圧縮方式で圧縮してからキャッシュに保存し、クライアントに返却します。

コンテンツ圧縮の流れ

クライアントからのリクエスト：
クライアントは、Accept-Encodingヘッダーにサポートする圧縮方式を指定して、CloudFront にコンテンツをリクエストします。
CloudFront での処理：
キャッシュヒット・キャッシュミスを行います。
クライアントでの展開：
クライアントは受信した圧縮データを指定された圧縮方式で展開し、内容を整形・表示します。

Amazon CloudFront で実際にコンテンツ圧縮機能を使ってみよう

では実際に Amazon CloudFront のコンテンツ圧縮機能を使ってみます。そのために、テスト用の S3 バケットと CloudFront ディストリビューションを作成します。

◯ 準備

まずは S3 バケットを作成します。

S3 バケット名については以下のルールを守る必要があります。

グローバル名前空間で一意であること
すべての Amazon S3 ユーザ間でバケット名が重複しないことが必要です。世界中の他のユーザーが使っていない名前のみ使用可能です。
バケット命名規則に従うこと
AWS が定めている以下のルールに従う必要があります。

バケット名は 3 (最少)～63 (最大) 文字の長さにする必要があります。

バケット名は、小文字、数字、ドット (.)、およびハイフン (-) のみで構成できます。

バケット名は、文字または数字で開始および終了する必要があります。

バケット名には、連続する 2 つのピリオドを含めることはできません。

バケット名は IP アドレスの形式 (192.168.5.4 など) にはできません。

バケット名のプレフィックスは xn-- で始まってはいけません。

バケット名を、プレフィックス sthree- または sthree-configurator で始めることはできません。

バケット名のサフィックスは -s3alias で終わってはいけません。

バケット名のサフィックスは --ol-s3 で終わってはいけません。

バケット名は、パーティション内のすべての AWS リージョンのすべての AWS アカウントにわたって一意である必要があります。パーティションは、リージョンのグループです。AWS には、現在、aws (標準リージョン)、aws-cn (中国リージョン)、および aws-us-gov (AWS GovCloud (US)) の 3 つのパーティションがあります。

バケットが削除されるまで、バケット名を同じパーティション内の別の AWS アカウントで使用することはできません。

Amazon S3 Transfer Acceleration で使用されるバケットの名前にドット (.) を付けることはできません。

Amazon Simple Storage Service ユーザーガイドより（一部抜粋）

以上の命名ルールに従い、今回は test–cloudfront とします。

「パブリックアクセスをすべてブロック」のチェックを外します。

その他はすべてデフォルト値で設定します。

次に CloudFront ディストリビューションを作成します。

オリジンに先ほど作成した S3 を設定します。

「オブジェクトを自動的に圧縮」が YES に設定されていることを確認します。

今回はテスト用ですのでウェブアプリケーションファイアウォール（WAF）は有効にしません。

その他は全てデフォルト値で作成します。

すると、以下のように新しいディストリビューションが作成されるとともに S3 バケットポリシーが作成されるため、そのとおりに更新します。

これでテスト用の S3 、CloudFront ディストリビューションの設定が完了しました。

◯ 実際に圧縮してみよう

S3 バケットに圧縮対象のコンテンツをアップロードします。

今回はこちらのフリー素材の svg ファイル猫画像を使います。

ファイル名は cat.svg 、圧縮前のファイルサイズは 7,738 バイトです。

以下のコマンドを使い、コンテンツ圧縮機能によって圧縮されたファイルをダウンロードしていきます。

curl -H "Accept-Encoding: br,gzip" ディストリビューションドメイン名/ダウンロードしたいファイル名 --output ダウンロード後につけたいファイル名

今回はダウンロードファイル名を test-cat.svg にします。

そして実際にコンテンツ圧縮機能を使って圧縮したファイルがこちらです。

7,738 バイト → 3,567 バイトですので、おおよそ半分ほどに圧縮されているのが分かります。

「オブジェクトを自動的に圧縮」を NO に設定し、cat.svg として再度ダウンロードすると

圧縮機能が機能しなくなり、ファイルサイズが 7,738 バイトと元に戻っていることが分かります。

このように、CloudFront のコンテンツ圧縮機能を用いればファイルサイズを大幅に縮小でき、冒頭に提示した様々なメリットを享受することができるのです。

Amazon CloudFront で圧縮できないファイルについて

非常に便利な圧縮機能ですが、すべてのファイルに対して有効というわけではありません。
圧縮の対象外となるファイルは、以下の通りです。

既に圧縮されているファイル
gzip や Brotli などの圧縮形式で保存されているファイルは、再度圧縮しても効果が期待できません。

専用の圧縮方式を持つファイル
画像、動画、音声、ドキュメントなどのファイルは、各々専用の圧縮方式を持っており、 Amazon CloudFront の一般的な圧縮アルゴリズムでは効果が低い、もしくはファイルが破損する可能性があります。
- 例
  - JPEG、PNG などの画像ファイル
  - MP4、H.264 などの動画ファイル
  - MP3、AAC などの音声ファイル

また画像や動画は、圧縮によって画質や音質が劣化する場合があります。特に、高画質な画像や動画は、圧縮による劣化が目立ちやすいため、元のファイルをそのまま配信することが推奨されます。

試しに png ファイルを圧縮してみます。

このファイル名は dog-mizu_tobasu.png です。