はじめに
ウェブサイトの読み込み速度は、ユーザーエクスペリエンスとSEOにとって非常に重要です。BrotliはGoogleが開発した圧縮アルゴリズムで、他の一般的な圧縮形式（gzipなど）よりも効率的にファイルを圧縮することができます。WordPressサイトでは、適切な設定によりHTTPレスポンスのサイズを大幅に削減し、ページの読み込み速度を向上させることが可能です。
症状・背景
Brotli圧縮が必要になる主な場面:
- サイトの読み込み時間が長い
- パフォーマンスが低くユーザーエクスペリエンスに影響がある
- SEOスコアを改善したい
- HTTPレスポンスサイズを削減したい
手順・設定方法
ステップ1: サーバーでBrotliサポートの確認とインストール
# Brotliが既にインストールされているかどうか確認
apache2ctl -M | grep brotli
# ディストリビューションに応じたコマンドでBrotliをインストール
sudo apt-get install libnginx-mod-http-brotli # Debian系
sudo yum install nginx-module-compression-brotli-1.14.0_2 # CentOS/RHELステップ2: Brotli圧縮設定の追加
# .htaccessファイルまたはApacheのコンフィギュレーションファイルにBrotli設定を追加
sudo nano /etc/apache2/mods-available/brotli.conf
<IfModule mod_brotli.c>
# text/htmlは通常gzipで圧縮されるため、Brotliは適用しない
SetOutputFilterByType DEFLATE html
# テキストファイルの圧縮設定
AddOutputFilterByType BROTLI text/css text/javascript application/x-javascript text/plain text/x-component application/font-woff image/svg+xml
# 画像の圧縮設定
AddOutputFilterByType BROTLI image/jpg image/png image/gif
</IfModule>ステップ3: Nginx設定ファイルへのBrotli設定追加
# Nginxのサーバーブロック設定ファイルを開く
sudo nano /etc/nginx/sites-available/default
server {
...
# Brotli圧縮設定を追加
brotli on;
brotli_static on;
# テキストファイルの圧縮レベルと型指定
brotli_types text/plain text/css application/json application/x-javascript text/xml;
brotli_comp_level 6; # 压缩级别，数值越高压缩率越高但压缩时间越长
# 画像の圧縮設定
brotli_types image/jpg image/png image/gif;
...
}ステップ4: 環境変数と設定を有効にする
# ApacheのBrotliモジュールを有効化し、サービスをリスタート
sudo a2enmod brotli && sudo systemctl restart apache2
# Nginx設定を有効にしてNginxを再起動
sudo nginx -t # 確認コマンド
sudo systemctl restart nginx注意事項
- Brotli圧縮はCPU負荷がかかるため、高負荷のウェブサーバーでは適切なレベルに設定することが重要。
- セキュリティ上、圧縮を適用するファイルタイプを厳選し、必要ない形式には適用しないこと。
- 実際のパフォーマンス効果はサイトコンテンツやブラウザの対応状況により異なるため、導入後は監視が必要。
まとめ
1. Brotli圧縮の導入: サイトの読み込み速度を向上させます。
2. 適切な設定: ファイルタイプや圧縮レベルを調整します。
3. モニタリング: 定期的にパフォーマンスとセキュリティをチェックします。
4. CPU負荷管理: 高負荷環境では適切な圧縮レベルを選択します。
5. テストと評価: ブラウザのキャッシュクリア後にブラウザデベロッパーツールで確認します。
関連記事: