Comment installer Nginx Google Pagespeed sur Debian 11 Bullseye

Le module PageSpeed de Google , également connu sous le nom de mod_PageSpeed, est un package de niveau serveur Apache HTTP ou Nginx open source avec des modules qui aident à optimiser votre site en utilisant divers filtres pour les pages qui optimisent les feuilles de style du serveur, les fichiers JavaScript et HTML et les images via la mise en cache et la réécriture parmi les meilleurs fonctionnalités.

Dans le didacticiel suivant, vous apprendrez comment installer et effectuer une configuration de base avec Nginx Pagespeed sur Debian 11 Bullseye.

Mettre à jour le système Debian

Mettez à jour votre Debian système d'exploitation pour s'assurer que tous les packages existants sont à jour :

sudo apt update && sudo apt upgrade -y

Installer les dépendances

Utilisez la commande suivante pour installer ou vérifier si les packages sont installés.

sudo apt install apt-transport-https unzip wget curl git dpkg-dev uuid-dev make build-essential gnupg2 ca-certificates lsb-release debian-archive-keyring -y

Installer la dernière version principale ou stable de Nginx

Pour la vitesse de page, vous devrez compiler la source Nginx, mais étant donné que vous essayez d'améliorer la vitesse de votre site, il est fortement recommandé d'importer et d'installer la dernière version de Nginx disponible entre mainline ou stable.

Nginx recommande d'utiliser la version principale, mais la version stable convient tout aussi bien aux utilisateurs qui ne souhaitent pas autant mettre à niveau.

IMPORTER UN SEUL RÉFÉRENTIEL, PAS LES DEUX.

Option 1 – Importer Nginx Mainline (recommandé)

curl -sSL https://packages.sury.org/nginx-mainline/README.txt | sudo bash -x

Option 2 – Importer Nginx stable

curl -sSL https://packages.sury.org/nginx/README.txt | sudo bash -x

Ensuite, exécutez une mise à jour apt update pour synchroniser.

sudo apt update

Commencez maintenant à installer Nginx ; le tutoriel installera nginx mainline .

sudo apt install nginx-core nginx-common nginx nginx-full -y

Activez le service à l'aide de la commande suivante.

sudo systemctl enable nginx --now

Dans le référentiel importé, vous remarquerez des modules supplémentaires disponibles dans cette version, notamment la prise en charge de brotli, que vous pouvez installer en suivant les étapes ci-dessous.

Ouvrez votre nginx.conf fichier de configuration :

nano /etc/nginx/nginx.conf

Ajoutez maintenant les lignes supplémentaires avant dans le HTTP{} rubrique :

brotli on;
brotli_comp_level 6;
brotli_static on;
brotli_types application/atom+xml application/javascript application/json application/rss+xml
  application/vnd.ms-fontobject application/x-font-opentype application/x-font-truetype
  application/x-font-ttf application/x-javascript application/xhtml+xml application/xml
  font/eot font/opentype font/otf font/truetype image/svg+xml image/vnd.microsoft.icon
  image/x-icon image/x-win-bitmap text/css text/javascript text/plain text/xml;

Ensuite, exécutez la simulation Nginx.

sudo nginx -t

La sortie devrait être l'exemple ci-dessous ; sinon, corrigez l'erreur que vous avez commise et corrigez-la.

Exemple :

nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

Redémarrez le service Nginx pour que les modifications soient en ligne.

sudo systemctl restart nginx

Télécharger le paquet source Nginx

Vous devrez compiler le "module ngx_pagespeed " depuis la source en tant que module dynamique. Si vous ne l'avez pas encore fait, nous expliquerons comment créer un répertoire à compiler pour ce module aujourd'hui et à l'avenir. Chaque fois que vous mettez à jour votre Nginx via le gestionnaire de packages APT, vous devez retélécharger la source et recompiler les modules dynamiques.

Tout d'abord, par défaut, le deb-src référentiel n'est pas ajouté et activé. Cela doit être importé et ajouté avant de pouvoir télécharger la source Nginx, sinon il récupérera la mauvaise version.

Option 1 – Nginx Mainline Deb-Source

echo "deb-src https://packages.sury.org/nginx-mainline/ bullseye main
" | sudo tee -a /etc/apt/sources.list.d/nginx-mainline.list

Option 2 – Nginx Stable Deb-Source

echo "deb-src https://packages.sury.org/nginx-mainline/ bullseye main" | sudo tee -a /etc/apt/sources.list.d/nginx.list

Ensuite, exécutez une mise à jour APT pour synchroniser le nouvel ajout.

sudo apt update

Créez le répertoire source Nginx.

sudo mkdir -p /usr/local/src/nginx

Allez maintenant dans votre répertoire nouvellement créé par CD.

cd /usr/local/src/nginx

Ensuite, téléchargez le package source Nginx selon la commande sudo ci-dessous.

sudo apt source nginx

Notez que vous verrez un message de refus. Cela peut être ignoré.

Exemple :

Ensuite, tapez la commande suivante pour confirmer que la source a été téléchargée.

ls -l

La sortie devrait être, par exemple.

Cloner le référentiel ngx_pagespeed

Dans la prochaine partie du guide, vous devrez télécharger le "ngx_pagespeed" paquet source. Il est recommandé de cloner la source de vitesse de page à l'aide de Git, car vous pouvez facilement extraire les mises à jour ultérieurement et recompiler à l'avenir.

Dans cette partie, vous avez deux options actuellement v1.13.35.2-stable branche de dépôt ou la v1.14.33.1-RC1 branche de pré-version. Les deux ont maintenant des problèmes. Une suggestion serait de visiter Git et de lire la liste des problèmes actuels pour voir si l'un vous affecterait plus que l'autre.

Le didacticiel a révélé que l'installation de la version préliminaire fonctionnait le mieux. Même si la stabilité peut vous être plus bénéfique, c'est un choix difficile à faire.

Tout d'abord, CD dans le répertoire :

cd /usr/local/src

Maintenant, clonez la source ngx_pagespeed git :

sudo git clone https://github.com/apache/incubator-pagespeed-ngx.git

La partie suivante peut être réalisée de deux manières différentes, stable ou pré-version. Les deux seront listés ci-dessous.

Option 2. Télécharger Stable ngx_pagespeed

CD dans le ngx_pagespeed nouvellement cloné source, consultez la dernière branche stable.

cd incubator-pagespeed-ngx

Découvrez la dernière version stable de pagespeed.

sudo git checkout latest-stable

Maintenant, vous auriez remarqué à la fin de la sortie "PSOL_BINARY_URL " imprimé. Le lien de téléchargement de l'URL PSOL correspond aux bibliothèques d'optimisation de la vitesse de page qui doivent être téléchargées à partir de la branche que vous avez utilisée, la caisse GIT.

Pour trouver l'URL des bibliothèques à télécharger, tapez la commande suivante pour révéler.

Utilisez la commande cat pour trouver l'URL :

cat PSOL_BINARY_URL

Exemple de résultat :

https://dl.google.com/dl/page-speed/psol/1.13.35.2-$BIT_SIZE_NAME.tar.gz

Notez que la sortie a "$BIT_SIZE_NAME " . Pour cela, la plupart des gens seront x64 .

Ensuite, téléchargez les bibliothèques d'optimisation PageSpeed (PSOL) pour continuer.

sudo wget https://dl.google.com/dl/page-speed/psol/1.13.35.2-x64.tar.gz

Extrayez maintenant l'archive. Cela créera un "psol ” répertoire automatiquement et extraire les fichiers. Vous obtiendrez une longue liste imprimée, mais toutes les bibliothèques sont prêtes à être compilées en tant que module dynamique avec votre source Nginx une fois terminé.

sudo tar xvf 1.13.35.2-x64.tar.gz

Option 2. Télécharger la pré-version ngx_pagespeed

Le processus d'utilisation du module pré-version ngx_pagespeed et des bibliothèques PSOL reste le même que pour la branche stable. Donc, tout ce que vous ferez sera de changer certaines options comme ci-dessous.

CD dans la source clone ngx_pagespeed, consultez la dernière branche de pré-version. Notez que la branche de pré-version changera très probablement à l'avenir.

Par conséquent, vous devriez visiter les branches du projet Github et trouver le dernier. Actuellement, la branche 36 est la branche de pré-version avec "v1.14.33.1-RC1 " . Nous sauterons l'étape sur le clonage, renvoyons à la "stable" pour les instructions.

cd incubator-pagespeed-ngx

Découvrez la branche pagespeed numérotée 36 :

sudo git checkout 36

Maintenant, vous auriez remarqué à la fin de la sortie "PSOL_BINARY_URL " imprimé. Le lien de téléchargement de l'URL PSOL correspond aux bibliothèques d'optimisation de la vitesse de page qui doivent être téléchargées à partir de la branche que vous avez utilisée, la caisse GIT.

Pour trouver l'URL des bibliothèques à télécharger, tapez la commande suivante pour révéler.

cat PSOL_BINARY_URL

Exemple de résultat :

https://dist.apache.org/repos/dist/release/incubator/pagespeed/1.14.36.1/x64/psol-1.14.36.1-apache-incubating-$BIT_SIZE_NAME.tar.gz

Notez que la sortie a "$BIT_SIZE_NAME " . Pour cela, la plupart des gens seront x64.

Ensuite, téléchargez les bibliothèques d'optimisation PageSpeed (PSOL) pour continuer.

wget https://dist.apache.org/repos/dist/release/incubator/pagespeed/1.14.36.1/x64/psol-1.14.36.1-apache-incubating-$BIT_SIZE_NAME.tar.gz

Extraire les archives.

sudo tar xvf psol-1.14.36.1-apache-incubating-x64.tar.gz

Compiler Nginx avec le module ngx_pagespeed

Ensuite, vous allez compiler la source Nginx que vous avez téléchargée avec le module ngx_pagespeed que vous avez téléchargé avec les bibliothèques PSOL.

Tout d'abord, CD dans votre répertoire source Nginx. Notez que le numéro de version de Nginx peut être différent.

Exemple uniquement :

cd /usr/local/src/nginx/nginx-1.21.4/

Ensuite, installez les dépendances de construction pour la source Nginx.

sudo apt build-dep nginx -y

Vous allez maintenant compiler le module ngx_pagespeed avec le « –with-compact flag " . Ce processus rendra le futur module de fichiers “ngx_pagespeed.so " compatible avec votre serveur Nginx actif.

sudo ./configure --with-compat --add-dynamic-module=/usr/local/src/incubator-pagespeed-ngx

Ensuite, utilisez la commande créer les modules . Ce processus durera environ 1 minute au maximum.

sudo make modules

Maintenant, copiez le nouveau "ngx_pagespeed.so" module dans votre répertoire de serveur Nginx actif. Les emplacements peuvent varier en fonction de votre installation, mais la plupart des gens devraient être les mêmes.

sudo cp objs/ngx_pagespeed.so /etc/nginx/modules/

Alternative :

sudo cp objs/ngx_pagespeed.so /usr/share/nginx/modules/

Charger le module ngx_pagespeed dans Nginx

Il est maintenant temps de charger le module ngx_pagespeed dans Nginx. Nous utiliserons pour cela l'éditeur de texte nano. Tout d'abord, ouvrez votre "nginx.conf " fichier.

sudo nano /etc/nginx/nginx.conf

Maintenant, ajoutez la ligne suivante.

 load_module modules/ngx_pagespeed.so; ##### insert with other modules ###

Exemple :

Pour finir, testez votre configuration Nginx dans la commande dry run, puis si ok redémarrez le serveur Nginx.

sudo nginx -t

Exemple :

 nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
 nginx: configuration file /etc/nginx/nginx.conf test is successful

Si la syntaxe Nginx est correcte, redémarrez le service Nginx :

sudo systemctl restart nginx

Créer un cache PageSpeed

Avant de configurer vos filtres, vous devez créer un répertoire de cache pour Nginx pagespeed afin de stocker les fichiers mis en cache et les conversions d'images. Cela peut être changé pour un emplacement de votre choix; cependant, nous le ferons sous le dossier Nginx pour le guide.

Créez le répertoire de cache :

sudo mkdir -p /etc/nginx/ngx_pagespeed_cache

Définir l'utilisateur www-data comme propriétaire (important) :

sudo chown -R www-data:www-data /etc/nginx/ngx_pagespeed_cache

Configuration des filtres PageSpeed

Maintenant, il existe plusieurs façons de configurer vos filtres de vitesse de page, et aucune n'est bonne ou mauvaise. Cependant, l'exemple créera un "pagespeed.conf" fichier de configuration pour ce tutoriel.

La raison en est que la configuration de la vitesse de page peut être délicate et peut souvent casser un site Web. Si vous souhaitez annuler rapidement les modules pagespeed, vous pouvez commenter l'inclusion pagespeed.conf ligne dans votre bloc serveur.

Créez le fichier pagespeed.conf :

sudo nano /etc/nginx/modules-available/pagespeed.conf

Ensuite, nous passerons en revue le filtre principal mis en place en toute sécurité pour la plupart des sites Web. Cependant, cela peut être changé et modifié en une grande quantité d'options différentes à l'avenir, mais vous devrez faire des recherches à ce sujet en consultant attentivement la documentation.

###enable pagespeed on the server block###
 pagespeed on;
 pagespeed Domain https://www.example.com;
 pagespeed Domain https://example.com;

###Add this line if your website runs on HTTPS###
 pagespeed FetchHttps enable;

###Set up admin location###
 admin console
 pagespeed Statistics on;
 pagespeed StatisticsLogging on;
 pagespeed StatisticsLoggingIntervalMs 60000;
 pagespeed StatisticsLoggingMaxFileSizeKb 1024;
 pagespeed MessageBufferSize 100000;
 pagespeed LogDir /var/log/pagespeed;
 pagespeed AdminPath /pagespeed_admin;

###SECURE THE LOCATION FROM BAD BOTS AND MALICOUS ACTORS###
 location ~ ^/pagespeed_admin {
    allow 127.0.0.1;
    allow your-own-IP-address;
    deny all;
 }


###Specify the file cache folder that you created earlier###
 pagespeed FileCachePath /etc/nginx/ngx_pagespeed_cache;

###Set the cache settings, you can play around with these numbers###
 pagespeed FileCacheSizeKb            102400;
 pagespeed FileCacheCleanIntervalMs   3600000;
 pagespeed FileCacheInodeLimit        500000;
 pagespeed LRUCacheKbPerProcess     1024;
 pagespeed LRUCacheByteLimit        16384;

###OPTIONAL: use Memcached to further increase performance of pagespeed###
 pagespeed MemcachedThreads 1;
 pagespeed MemcachedServers "localhost:11211";

###Ensure requests for pagespeed optimized resources go to the pagespeed handler###
 and no extraneous headers get set.
 location ~ ".pagespeed.([a-z].)?[a-z]{2}.[^.]{10}.[^.]+" {
   add_header "" "";
 }
 location ~ "^/pagespeed_static/" { }
 location ~ "^/ngx_pagespeed_beacon$" { }

###Set the most common safe filters###
 pagespeed RewriteLevel CoreFilters;

Maintenant, vous avez peut-être remarqué que nous avons renommé dans le répertoire pagespeed nouvellement créé le fichier de configuration "pagespeed-example.com.conf .” Cela a été fait comme si vous hébergez plusieurs sites Web sur le même serveur. Certains peuvent nécessiter une personnalisation différente de la vitesse de page, donc la séparation des fichiers de configuration évitera que votre configuration ne devienne désordonnée.

L'option de filtre définie était "CoreFilters" comme niveau de réécriture. Dans l'ensemble, PageSpeed propose trois niveaux de réécriture :"CoreFilters, PassThrough, et OptimizeForBandwidth" . Comme vous l'avez peut-être remarqué dans les commentaires d'origine, "CoreFilters" est sûr pour la plupart des sites Web et est utilisé par défaut pour les tests.

Les filtres principaux consistent en :

add_head – Ajoute un élément au document s'il n'est pas déjà présent.
combine_css – Combine plusieurs éléments CSS en un seul.
combine_javascript – Combine plusieurs éléments de script en un seul.
convert_meta_tags – Ajoute un en-tête de réponse pour chaque balise meta avec un attribut http-equiv.
extend_cache – Prolonge la durée de vie du cache des ressources CSS, JS et d'image qui n'ont pas été optimisées autrement en signant les URL avec un hachage de contenu.
fallback_rewrite_css_urls – Réécrit les ressources référencées dans n'importe quel fichier CSS qui ne peuvent autrement pas être analysées et minifiées.
aplatir_css_imports – Inline CSS en aplatissant toutes les règles @import.
inline_css – Insère de petits fichiers CSS dans le document HTML.
inline_import_to_link – En ligne