Minifier les fichiers CSS
Que signifient "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.
Vous pouvez activer l'option Minifier les fichiers CSS à partir de l'onglet Optimisation des fichiers, comme suit :
Comment WP Rocket fait-il ceci ?
- WP Rocket recherche dans le HTML de la page et découvre les fichiers CSS dans les balises
link
. Les fichiers doivent avoir l'extension.css
. - Le CSS externe (c'est-à-dire le CSS hébergé sur un autre domaine) est hébergé sur votre domaine et traité par la minification. 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, pour faire sauter les les caches navigateur.
Fichier original :https://example.com/wp-content/themes/twentytwenty/style.css?ver=1.5
Fichier minifié :
https://example.com/wp-content/cache/min/1/wp-content/themes/twentytwenty/style.css?ver=1614629992
- L'ordre des fichiers sur la page ne change pas, nous remplaçons simplement les fichiers CSS existants par leur versions optimisées.
- Cette optimisation n'est appliquée que sur les pages mises en cache ou optimisées.
- Les fichiers hébergés localement chargés via
@import
seront traités et inclus dans les fichiers minifiés.
Certains fichiers sont automatiquement exclus
Ces fichiers ne seront pas traités :
- Les fichiers hébergés sur un domaine tiers et chargés via
@import
ne seront pas traités. - Noms de fichiers contenant
.min
- ils sont déjà minifiés - Les fichiers avec
.min
dans leurs noms de fichiers qui contiennent également une règle@font-face
seront optimisés. WP Rocket minimisera les règles CSS et appliquera l'affichagefont-display: swap;
descripteur des polices, veuillez lire ici. - Fichiers avec la balise
data-no-minify
, - Fichiers avec un type de support spécifié comme
only screen and
- Fichiers avec un type de média autre que
screen
etall
Améliorer le chargement des polices
Lorsque la minification est active, WP Rocket applique automatiquement font-display : swap;
à toutes les polices appelées au sein des fichiers CSS et n’ayant pas de propriété font-display
Cela permettra d'améliorer la recommandation PageSpeed : Ensure text remains visible during webfont load.