# Nginx 1.21 et le module Brotli : compresser un site WordPress mieux que gzip > 15 à 20 % de gain supplémentaire sur les fichiers texte face à gzip : ce que la compilation du module Brotli apporte réellement à un site WordPress texte-lourd. - Auteur : WordPress Développement - Publié le : 2021-07-24 - Mis à jour le : 2021-07-24 - Catégorie : Hébergement & serveurs - URL : https://www.wpmoderne.fr/hebergement/nginx-121-module-brotli-compresser-wordpress/ ## L’essentiel - Brotli compresse en général 15 à 20 % de plus que gzip sur du texte - Le module ne fait pas partie du binaire nginx par défaut, il faut le compiler - La compression statique pré-générée évite le coût CPU au niveau de qualité maximal 18 % : c'est le gain de poids moyen mesuré sur les fichiers CSS et JavaScript d'un site WordPress à fort contenu éditorial, après remplacement de la compression gzip par Brotli. Sur un site qui vit surtout de son temps de chargement perçu par les lecteurs, cet écart se traduit directement en millisecondes gagnées à chaque page vue. Brotli, développé par Google et normalisé depuis plusieurs années, compresse généralement mieux que gzip sur les contenus textuels comme le HTML, le CSS, le JavaScript et les flux JSON, au prix d'un coût de calcul plus élevé selon le niveau de compression choisi. nginx ne l'intègre pas par défaut dans son binaire standard, ce qui impose une compilation du module ou l'usage d'un paquet tiers déjà compilé selon la distribution utilisée. ## Pourquoi Brotli et pas seulement gzip gzip reste largement suffisant pour la majorité des sites, et il ne s'agit pas de le remplacer partout sans discernement. Sur un site texte-lourd, avec de longs articles, une bibliothèque JavaScript conséquente et plusieurs feuilles de style, le gain de compression supplémentaire apporté par Brotli devient perceptible sur le temps de chargement, en particulier pour les visiteurs en connexion mobile avec une bande passante limitée. ## Compiler le module Brotli pour nginx > L'essentiel à retenir : Brotli compresse en général 15 à 20 % de plus que gzip sur du texte ; Le module ne fait pas partie du binaire nginx par défaut, il faut le compiler ; La compression statique pré-générée évite le coût CPU au niveau de qualité maximal Le module officiel `ngx_brotli` doit être compilé avec les sources de nginx, ou installé via un paquet précompilé selon la distribution. Sur Debian, la compilation depuis les sources reste la méthode la plus fiable pour disposer d'une version à jour du module : ``` git clone https://github.com/google/ngx_brotli.git cd ngx_brotli && git submodule update --init ./configure --add-module=../ngx_brotli \ --with-http_v2_module \ --prefix=/etc/nginx make && make install ``` Une fois le module intégré au binaire, la configuration du bloc serveur active la compression statique et dynamique séparément : ``` brotli on; brotli_comp_level 5; brotli_types text/plain text/css application/javascript application/json application/xml text/xml; brotli_static on; ``` ## Le compromis entre niveau de compression et charge CPU Le niveau de compression Brotli va de 0 à 11 : plus il est élevé, meilleur est le taux de compression, mais plus le coût CPU par requête augmente, particulièrement sensible sur des fichiers générés dynamiquement à chaque requête. Un niveau 5 ou 6 en compression à la volée offre un bon compromis pour la plupart des sites, tandis que le niveau 11 s'utilise presque exclusivement en compression statique pré-générée, calculée une seule fois au moment du build plutôt qu'à chaque requête. ``` # Pré-générer les fichiers .br au build, niveau maximal brotli --quality=11 style.css -o style.css.br ``` Avec `brotli_static on`, nginx sert directement le fichier `.br` pré-généré s'il existe et si le navigateur l'accepte, sans recalcul à chaque requête, ce qui permet d'utiliser le niveau de compression maximal sans coût CPU récurrent. ## Gains mesurés sur ce projet | Type de fichier | Poids gzip niveau 6 | Poids Brotli niveau 11 | | --- | --- | --- | | Feuille CSS principale | 42 Ko | 34 Ko | | Bundle JavaScript du thème | 78 Ko | 63 Ko | | Page HTML d'article type | 21 Ko | 18 Ko | ## Ce qui reste à surveiller - Vérifier que la mise à jour de nginx ne casse pas la compilation du module, celui-ci n'étant pas intégré au cœur officiel - Conserver gzip en repli pour les navigateurs qui ne supportent pas Brotli, via l'en-tête `Accept-Encoding` - Automatiser la génération des fichiers `.br` statiques dans le pipeline de build du thème, pas manuellement > Un conseil issu de plusieurs migrations : ne jamais activer Brotli en compression dynamique à un niveau élevé sur un site à fort trafic sans avoir mesuré l'impact CPU au préalable, sous peine de gagner en poids de page ce qu'on perd en temps de réponse serveur. ## En résumé Le module Brotli pour nginx apporte un gain réel et mesurable sur un site WordPress texte-lourd, à condition de séparer clairement compression dynamique à niveau modéré et compression statique pré-générée à niveau maximal. La compilation du module demande un peu plus d'effort qu'activer gzip par défaut, mais ce coût initial reste modeste face au gain durable sur le poids des pages servies.