Minifier et combiner les fichiers JavaScript - Comment ça fonctionne ?

Que signifient "minifier" et "combiner" ?

Minifier

La minification est le processus qui consiste à supprimer les espaces blancs et les commentaires du code. Cela permet de réduire la taille du fichier, donc de le télécharger plus rapidement. La minification seule ne réduit pas le nombre de requêtes HTTP sur votre site.

Combiner

Lorsque l'option Combiner les fichiers JS est activée, tous les fichiers JS sont combinés en un seul fichier JS, ce qui réduit le nombre de requêtes HTTP sur votre site. La combinaison est une bonne pratique lorsque votre site utilise HTTP/1 mais pas nécessairement lors de l'utilisation du protocole HTTP/2.

Comment WP Rocket fait-il ceci ?

WP Rocket recherche dans le HTML de la page et découvre les fichiers avec l'extension .js et les scripts en ligne au sein des balises script.
Le JS externe (c'est-à-dire le CSS hébergé sur un autre domaine) est hébergé sur votre domaine et traité à la fois par les options minifier et combiner (auparavant, le JS externe n'était traité que lorsque l’option Combiner les JS était active). Cela permet de répondre aux recommandations des outils de test de vitesse et de réduire le nombre de résolutions DNS nécessaires.
Les fichiers sont traités et les versions optimisées sont stockées dans : cache/min/1/
Si vous utilisez le mode multisite de WordPress, le dossier nommé /1/ sera modifié pour refléter le numéro du site.
Les fichiers minifiés contiennent une chaîne de requête (?ver=) avec l'horodatage de la dernière modification, afin de déjouer les caches navigateur :
Fichier original : https://example.com/wp-content/themes/twentytwenty/assets/js/index.js?ver=1.5
Fichier minifié : https://example.com/wp-content/cache/min/1/wp-content/themes/twentytwenty/assets/js/index.js?ver=1614629419
Une chaîne aléatoire est ajoutée au nom du fichier combiné à chaque fois qu'il est régénéré, afin de déjouer les caches navigateur : https://www.example.org/wp-content/cache/min/1/wp-content/themes/twentytwenty/assets/js/index-0cc17ef685f255d7641b2f7967e977cd.js
Si seul Minifier est activé, l'ordre des fichiers sur la page ne change pas, nous remplaçons simplement les fichiers JS existants par leur versions optimisées.
Si Combiner est activé, le fichier combiné est inséré dans la page juste avant la balise de fermeture body , ainsi il ne bloquera pas le rendu.
Cette optimisation n'est appliquée que sur les pages mises en cache ou optimisées.

Certains fichiers sont automatiquement exclus

Ces fichiers ne seront pas traités :

Nous avons quelques exclusions automatiques pour les compatibilités des plugins et des thèmes
Noms de fichiers contenant .min - ils sont déjà minifiés
Balises de script avec l'attribut : data-no-minify="1"
Les scripts localisés sont exclus
Scripts en ligne exclus