Aller au contenu

Activer la compression Brotli sur NGINX

Compressez votre contenu de 15 à 25 % mieux que gzip avec l'algorithme Brotli de Google.


  • 15-25 % Plus Petit


    Brotli atteint de meilleurs taux de compression que gzip pour le contenu texte.

  • Support Universel


    Tous les navigateurs modernes supportent Brotli (Chrome, Firefox, Safari, Edge).

  • Chargements de Pages Plus Rapides


    Des fichiers plus petits = des téléchargements plus rapides, surtout sur les réseaux mobiles.

  • Coûts de Bande Passante Réduits


    Réduisez les coûts de transfert de données avec une meilleure compression.


Support des Navigateurs

Brotli est supporté par 95 %+ des navigateurs dans le monde :

Navigateur Support Brotli
Chrome ✅ Depuis v50 (2016)
Firefox ✅ Depuis v44 (2016)
Safari ✅ Depuis v11 (2017)
Edge ✅ Depuis v15 (2017)
Opera ✅ Depuis v38 (2016)

NGINX revient automatiquement à gzip pour les navigateurs plus anciens.


Configuration Rapide

Étape 1 : Installer le Module Brotli

# Installer le dépôt GetPageSpeed
dnf -y install https://extras.getpagespeed.com/release-latest.rpm

# Installer le module Brotli
dnf -y install nginx-module-brotli

Activez dans /etc/nginx/nginx.conf :

load_module modules/ngx_http_brotli_filter_module.so;
load_module modules/ngx_http_brotli_static_module.so;

Étape 2 : Configurer la Compression Brotli

Créez /etc/nginx/conf.d/brotli.conf :

# Activer la compression Brotli
brotli on;
brotli_comp_level 6;
brotli_static on;

brotli_types
    text/plain
    text/css
    text/javascript
    text/xml
    application/javascript
    application/json
    application/xml
    application/xml+rss
    application/xhtml+xml
    application/atom+xml
    application/rss+xml
    application/x-javascript
    application/x-font-ttf
    application/x-font-opentype
    application/vnd.ms-fontobject
    font/ttf
    font/otf
    font/opentype
    font/woff
    font/woff2
    image/svg+xml
    image/x-icon;

Rechargez NGINX :

nginx -t && systemctl reload nginx

Étape 3 : Vérifier que Cela Fonctionne

# Demande avec support Brotli
curl -sI -H 'Accept-Encoding: br' https://example.com | grep -i encoding
# Content-Encoding: br

# Comparer les tailles
curl -so /dev/null -w '%{size_download}' -H 'Accept-Encoding: gzip' https://example.com
# 45678
curl -so /dev/null -w '%{size_download}' -H 'Accept-Encoding: br' https://example.com
# 38912  (plus petit !)

Niveaux de Compression

Niveau Vitesse Compression Cas d'Utilisation
1-3 Rapide Plus Bas Trafic élevé, limité par le CPU
4-6 Équilibré Bon La plupart des sites web (recommandé)
7-9 Plus Lent Meilleur Actifs statiques pré-compressés
10-11 Très lent Meilleur Compression uniquement au moment de la construction

Recommandation

Utilisez le niveau 4-6 pour le contenu dynamique et le niveau 11 pour les actifs statiques pré-compressés.


Pré-Compresser les Actifs Statique

Pour des performances maximales, pré-comprimez les fichiers au moment de la construction :

# Installer l'outil CLI Brotli
dnf -y install brotli

# Compressez vos fichiers statiques
find /var/www/html -type f \( -name "*.css" -o -name "*.js" -o -name "*.html" -o -name "*.svg" \) \
    -exec brotli -kf --best {} \;

Cela crée des fichiers .br à côté des originaux. NGINX les sert automatiquement avec brotli_static on.


Comparaison des Tailles

Exemple du monde réel (jQuery 3.6.0 minifié) :

%%{init: {'theme': 'base', 'themeVariables': { 'primaryColor': '#009639', 'primaryTextColor': '#fff'}}}%%
pie showData
    title Comparaison de la Taille des Fichiers
    "Original (89KB)" : 89
    "Gzip (31KB)" : 31
    "Brotli (27KB)" : 27
Format Taille Économies
Original 89 Ko
Gzip 31 Ko 65 %
Brotli 27 Ko 70 %

Configuration Avancée

Garder Gzip comme Solution de Repli

# Brotli (priorité)
brotli on;
brotli_comp_level 6;

# Gzip (solution de repli)
gzip on;
gzip_comp_level 5;
gzip_types text/plain text/css application/javascript application/json;

Différents Niveaux pour Dynamique vs Statique

# Contenu dynamique - compression plus rapide
brotli on;
brotli_comp_level 4;

# Fichiers statiques pré-compressés - meilleure compression
brotli_static on;

Seuil de Taille Minimum

# Ne pas compresser les petits fichiers (pas rentable)
brotli_min_length 256;

Dépannage

Brotli ne fonctionne pas
  1. Vérifiez que le module est chargé :

    nginx -V 2>&1 | grep brotli
    

  2. Vérifiez que la demande inclut Accept-Encoding: br

  3. Vérifiez que le Content-Type de la réponse est dans brotli_types

Utilisation du CPU trop élevée

Abaissez le niveau de compression :

brotli_comp_level 4;  # ou même 2-3

Fichiers non compressés
  • Vérifiez que la taille du fichier > brotli_min_length
  • Vérifiez que le Content-Type correspond à brotli_types
  • Vérifiez que la connexion n'est pas déjà compressée (CDN)

Liens Connexes