Activation de Gzip sur les serveurs Nginx (y compris Laravel Forge)

J’ai récemment reçu un e-mail de Google disant que Karani a quelques pages qui se chargent trop lentement sur mobile et seront donc pénalisées dans ses résultats de recherche. J’ai été choqué, car l’optimisation mobile lourde est une priorité sur Karani depuis le premier jour.

Je suis allé aux résultats Google PageSpeed auxquels ils étaient liés et j’ai constaté que Gzip n’était pas activé (en savoir plus sur Gzip). Alors, voici les étapes que j’ai suivies pour le réactiver:

1. Déterminez vos paramètres

J’ai choisi de copier les paramètres recommandés par HTML5Boilerplate – c’est ce que j’utilisais sur mon ancien serveur Apache et ils fonctionnaient très bien. H5bp est une collection de sagesse merveilleusement organisée dont je suis heureux de bénéficier.

Vous pouvez les trouver ici : h5bp nginx config

2. Connectez-vous en SSH à votre serveur et modifiez votre configuration nginx

SSH dans votre serveur. Préparez votre mot de passe sudo.

je vais utiliser vimmais vous pouvez utiliser l’éditeur de votre choix.

sudo vim /etc/nginx/nginx.conf

Vous pouvez voir qu’il existe déjà un bloc de paramètres concernant Gzip ; vous pouvez toujours simplement les modifier et décommenter les bonnes lignes. Mais puisque nous sommes déjà préparés avec notre version HTML5Boilerplate, pourquoi ne pas simplement effacer ces lignes :

        ##
        # Gzip Settings
        ##

        Gzip on;
        Gzip_disable "msie6";

        # Gzip_vary on;
        # Gzip_proxied any;
        # Gzip_comp_level 6;
        # Gzip_buffers 16 8k;
        # Gzip_http_version 1.1;
        # Gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;

3. Ajoutez vos paramètres de configuration

Là où se trouvaient les anciens paramètres Gzip, collez vos nouveaux paramètres. Voici ce qu’ils sont au moment de la rédaction de cet article :

  # Compression

  # Enable Gzip compressed.
  gzip on;

  # Enable compression both for HTTP/1.0 and HTTP/1.1.
  gzip_http_version  1.1;

  # Compression level (1-9).
  # 5 is a perfect compromise between size and cpu usage, offering about
  # 75% reduction for most ascii files (almost identical to level 9).
  gzip_comp_level    5;

  # Don't compress anything that's already small and unlikely to shrink much
  # if at all (the default is 20 bytes, which is bad as that usually leads to
  # larger files after gzipping).
  gzip_min_length    256;

  # Compress data even for clients that are connecting to us via proxies,
  # identified by the "Via" header (required for CloudFront).
  gzip_proxied       any;

  # Tell proxies to cache both the gzipped and regular version of a resource
  # whenever the client's Accept-Encoding capabilities header varies;
  # Avoids the issue where a non-gzip capable client (which is extremely rare
  # today) would display gibberish if their proxy gave them the gzipped version.
  gzip_vary          on;

  # Compress all output labeled with one of the following MIME-types.
  gzip_types
    application/atom+xml
    application/javascript
    application/json
    application/rss+xml
    application/vnd.ms-fontobject
    application/x-font-ttf
    application/x-web-app-manifest+json
    application/xhtml+xml
    application/xml
    font/opentype
    image/svg+xml
    image/x-icon
    text/css
    text/plain
    text/x-component;
  # text/html is always compressed by HttpGzipModule

4. Redémarrez Nginx

Vous pouvez utiliser la forge nginx restart liste déroulante, mais puisque vous êtes connecté à SSH, vous pouvez également simplement exécuter sudo service nginx restart.

5. Testez

~~Tapez n’importe quelle URL dans CheckGzipCompression.com. Vous pouvez tester les deux pages html (par exemple https://karaniapp.com/) ou des actifs individuels comme votre JavaScript et CSS.~~

CheckGzipCompression.com semble être incohérent. Des instructions seront bientôt disponibles sur la façon de le faire vous-même, et Chris Fidao suggère https://redbot.org.

5. Bénéfice

C’est tout – vous compressez maintenant avec Gzip tous vos éléments textuels de base et quelques autres types d’images gratuites également. Allez-y et wow Google.