Webパフォーマンス向上の鍵「レスポンス圧縮とその最適化手法」の後編をお届けします

前編はこちら▼

5. 通常のWebサーバーで圧縮レスポンスを返す流れ

Cloudflareを利用せずに、nginxやApache、PHPなどのWebサーバーで圧縮レスポンスを提供する場合、以下の手順が必要です。

1. Webサーバーの設定
2. • nginx: nginxでGzipやBrotliを有効にするには、nginx.confに以下の設定を追加します。

     gzip on;
     gzip_types text/plain text/css application/json application/javascript;
     gzip_min_length 1000;
     gzip on;
     gzip_types text/plain text/css application/json application/javascript;
     gzip_min_length 1000;
     

     Brotliを利用する場合は、モジュールをインストールした上で以下のように設定します：

     brotli on;
     brotli_types text/html text/css application/javascript;
     brotli_comp_level 6;
     brotli on;
     brotli_types text/html text/css application/javascript;
     brotli_comp_level 6;
     

   • Apache: Apacheでは、mod_deflateまたはmod_brotliを有効化し、以下のような設定をhttpd.confに記述します：

     <IfModule mod_deflate.c>
         AddOutputFilterByType DEFLATE text/plain text/html
     </IfModule>
     <IfModule mod_deflate.c>
         AddOutputFilterByType DEFLATE text/plain text/html
     </IfModule>
     

     <IfModule mod_brotli.c>
         AddOutputFilterByType BROTLI text/html text/css application/javascript
     </IfModule>
     <IfModule mod_brotli.c>
         AddOutputFilterByType BROTLI text/html text/css application/javascript
     </IfModule>
     

2. PHPの対応 PHPアプリケーションの場合、圧縮を直接制御するには、zlib.output_compressionを有効にします。
3. • php.iniでの設定:

     zlib.output_compression = On
     zlib.output_compression_level = 6
     zlib.output_compression = On
     zlib.output_compression_level = 6
     

   • または、コード内で直接制御する場合:

     ob_start('ob_gzhandler');
     ob_start('ob_gzhandler');
     

3. メンテナンスと運用コスト サーバーごとに圧縮設定を行うため、以下の課題が生じます：
4. • 設定の複雑化：サーバーごとの設定ファイルの記述ミスや、圧縮形式の競合を避ける必要があります。
   • 運用負荷：新しい圧縮形式（例：Zstd）が登場するたびに、モジュールの更新や再設定が必要です。

6. 圧縮形式の違いについて

Cloudflareのテストでは、ZstandardはBrotliより42%速く圧縮し、Gzipより11.3%効率的であることが示されています。また、その設計背景には、大規模なデータ処理を高速かつ効率的に行うニーズがあり、オープンソース化されたことで、広く利用されるようになっています。

詳細な技術情報は Zstandard GitHubリポジトリ をご覧ください。

7. Cloudflareで圧縮ルールを設定する

Cloudflareを利用すると、Webサーバー側での複雑な設定を行わずに、効率的に圧縮を管理できます。特に、圧縮ルールを活用することで、特定の条件に基づいて圧縮を柔軟に制御できます。以下では、Cloudflareダッシュボードを使用して圧縮ルールを設定する手順と、その利点について詳しく説明します。

圧縮ルールの作成手順

1. Cloudflareダッシュボードにログイン
2. • Cloudflareのアカウントにログインし、対象のドメインを選択します。
2. 「圧縮ルール」を選択
3. • 左側のサイドバーから「ルール」→「圧縮ルール」を選びます。
3. 新しい圧縮ルールの作成
4. • 「ルールを作成」ボタンをクリックします。
4. 条件の設定
5. • デフォルトのコンテンツ タイプ を選択した場合 Cloudflare の デフォルトコンテンツタイプが対象となります
   • カスタムフィルタ式を選択し圧縮を適用する条件（URLパス、クエリパラメータ、HTTPメソッド、ユーザーエージェントなど）を指定できます
5. 圧縮の種別
6. • Zstandard (Zstd) 圧縮を有効にする
   • サポートされていない場合は、自動的に Brotli、Gzip、または非圧縮データにフォールバック
   • Brotli と Gzip 圧縮を有効にする
   • Cloudflare のデフォルトの圧縮設定を有効に Brotli > Gzip の優先度で圧縮します
   • 圧縮を無効にする
   • 圧縮を無効にします

圧縮ルール設定のポイント

• 細かな条件指定: リクエストのURLパス、クエリパラメータ、HTTPメソッド、ユーザーエージェントなど、多様な条件で圧縮を制御できます。
• 柔軟な圧縮制御: 特定のコンテンツタイプやファイル拡張子に対して圧縮を有効または無効にすることで、最適なパフォーマンスを実現できます。
• 最新の圧縮アルゴリズム対応: CloudflareはZstandard、Brotli、Gzipなどの主要な圧縮形式をサポートし、クライアントの対応状況に応じて最適な圧縮を自動的に選択します。

圧縮ルールの活用例

• 画像や動画の圧縮を無効化
• • 既に圧縮されているメディアファイルに対して圧縮を無効化し、不要なリソース消費を防ぐ。

    条件: http.request.uri.path matches "*.jpg" or "*.png" or "*.mp4"
    アクション: Disable Compression
    条件: http.request.uri.path matches "*.jpg" or "*.png" or "*.mp4"
    アクション: Disable Compression
    

• 特定のユーザーエージェントへの圧縮適用
• • 最新ブラウザを使用しているユーザーに対して、Zstandardを適用。

    条件: http.user_agent contains "Chrome" or "Firefox"
    アクション: Enable Compression (Zstandard)
    条件: http.user_agent contains "Chrome" or "Firefox"
    アクション: Enable Compression (Zstandard)
    

大容量ファイルのみ圧縮

• • サイズが一定以上のレスポンスに対してのみ圧縮を適用。

    条件: response.body.size gt 100KB
    アクション: Enable Compression
    条件: response.body.size gt 100KB
    アクション: Enable Compression
    

Cloudflareで圧縮ルールを利用する利点

• サーバーリソースの節約: 圧縮処理をエッジネットワークで行うため、オリジンサーバーの負荷を軽減できます。
• パフォーマンスの向上: クライアントに最も近い場所で圧縮が行われるため、データ転送量の削減と応答時間の短縮が可能です。
• 管理の容易さ: Webサーバーやアプリケーションの設定を変更することなく、圧縮設定をクラウド上で一元管理できます。
• 最新技術の迅速な適用: 新しい圧縮アルゴリズムがサポートされた場合でも、Cloudflare側で自動的に適用されます。

注意事項

• ルールの優先順位に留意: 複数のルールが適用される場合、優先順位設定により意図しない動作を避けることが重要です。
• クライアントの互換性: 最新の圧縮形式（例：Zstandard）は一部のブラウザでのみサポートされています。Cloudflareは自動的に対応可能な圧縮形式を選択しますが、主要なユーザー層のブラウザ対応状況を把握しておくことが望ましいです。
• セキュリティへの配慮: 圧縮によるセキュリティリスク（例：BREACH攻撃）を考慮し、機密情報を含むレスポンスに対しては圧縮を無効化するなどの対策が必要です。

圧縮ルール設定後の確認

• レスポンスヘッダーの確認: 開発者ツールやネットワークモニタリングツールを使用して、Content-Encoding ヘッダーが期待通りになっているか確認します。
• パフォーマンスの測定: Webページの読み込み速度やデータ転送量を測定し、圧縮ルールの効果を評価します。
• ログの監視: Cloudflareの分析ツールやログを活用し、圧縮ルールの適用状況やエラーの有無を定期的にチェックします。

8. まとめ

レスポンス圧縮は、Webサイトのパフォーマンス向上とユーザー体験の最適化に不可欠な技術です。 特に、Cloudflareの圧縮ルールを活用することで、効率的な圧縮設定を柔軟に管理できます。 最新の圧縮アルゴリズムであるZstandard（Zstd）を導入することで、 より高速かつ効率的な圧縮を実現し、ユーザーに最適なコンテンツ配信を提供できます。