Performance - WebP, lazy load, minify & cache. Performance accélère votre boutique avec la diffusion en WebP (avec retour sûr à l'image d'origine), le chargement différé des images, la minification et le regroupement des CSS et JS, les en-têtes de cache navigateur, les indications preload et preconnect et un entretien non destructif de la base de données. Chaque optimisation a son propre interrupteur : vous activez exactement ce que votre thème supporte et vous laissez le reste de côté. Aucun code, aucune modification du thème.
Performance accélère votre boutique avec la diffusion en WebP (avec retour sûr à l'image d'origine), le chargement différé des images, la minification et le regroupement des CSS et JS, les en-têtes de cache navigateur, les indications preload et preconnect et un entretien non destructif de la base de données. Chaque optimisation a son propre interrupteur : vous activez exactement ce que votre thème supporte et vous laissez le reste de côté. Aucun code, aucune modification du thème.
1. Installation
- Dans le back office, allez dans Modules → Gestionnaire de modules → Téléverser un module et sélectionnez le ZIP du module.
- Une fois l'installation terminée, cliquez sur Configurer pour ouvrir l'assistant.
.local, .test, localhost) sont toujours autorisés. Dès qu'une nouvelle version est disponible, elle est signalée directement dans le module.Si, à la place de la confirmation, vous lisez « Upload failed », PrestaShop a peut-être désactivé le module sans vous le dire : vos réglages et vos données restent en place. Comment mettre à jour un module, et que faire en cas de « Upload failed ».
2. Configuration : étape par étape
L'écran Configurer tient sur une seule page : un panneau d'état, les réglages de chaque optimisation, les boutons d'action et un outil de nettoyage de la base de données.
État
Un panneau de contrôle en lecture seule, affiché en haut de la page.
- Interrupteur général : indique si les optimisations sont actuellement actives ou non.
- Moteur WebP (GD/Imagick) : indique si le serveur sait produire du WebP. Si ce n'est pas le cas, la réécriture en WebP est simplement ignorée.
- Dossier de cache WebP accessible en écriture : indique si les fichiers WebP produits peuvent être enregistrés.
- Bloc .htaccess de cache navigateur : indique si les règles de cache sont actuellement écrites.
Général et images interrupteur général
L'interrupteur général et toutes les optimisations d'images.
- Activer les optimisations : interrupteur général. Désactivé, le module ne fait rien sur le front office.
- Diffuser en WebP : enveloppe les images dans une balise
<picture>avec une source WebP et l'image d'origine en secours. - Chargement différé des images / Chargement différé des iframes et vidéos : ajoutent
loading="lazy"là où il manque. Le logo, les images de l'en-tête de la page, les 3 premières images et les images prioritaires se chargent tout de suite. - Secours IntersectionObserver : petit script pour les vieux navigateurs sans chargement différé natif.
- Qualité WebP (1-100) : la qualité de compression utilisée pour produire les WebP.
CSS / JS / HTML
Combinez et minifiez vos fichiers. Les options « invasives » sont désactivées par défaut : essayez-les sur votre thème.
- Combiner et minifier le CSS (invasif) / Combiner et minifier le JS (invasif) : désactivés par défaut. Ils activent le CCC natif de PrestaShop (combinaison, compression et mise en cache) : toutes les feuilles de style locales sont fusionnées en un seul fichier minifié, et les scripts locaux en un seul fichier minifié par position, ce qui peut modifier l'ordre de chargement. Testez votre thème après l'activation.
- Minifier le HTML (invasif) : supprime les espaces inutiles ;
pre/textarea/script/stylesont préservés. - Exclusions : un fragment par ligne ; toute image dont l'adresse contient l'un de ces fragments est laissée telle quelle (ni WebP, ni chargement différé).
Preload / Preconnect
Ajoutez des indications de ressources pour accélérer le premier affichage.
- Preload : une adresse par ligne pour les polices et les fichiers critiques. L'attribut
asest déduit de l'extension. - Preconnect : une origine par ligne, par exemple
https://fonts.gstatic.com.
CSS critique (avancé) facultatif
Intègre directement dans le <head> de la page le CSS de la partie visible sans défilement. C'est une option avancée, désactivée par défaut.
- Intégrer le CSS critique (invasif) : désactivé par défaut ; intègre dans le head le CSS saisi ci-dessous.
- CSS de la partie visible : le CSS à intégrer. Laissez vide si vous ne savez pas quoi en extraire.
Seuils d'entretien de la base de données
L'ancienneté que doivent avoir les données temporaires avant que l'outil de nettoyage y touche.
- Paniers abandonnés plus vieux que (jours)
- Connexions et invités plus vieux que (jours)
- Lignes de journal plus vieilles que (jours)
Chaque valeur va de 7 à 3650 jours. Ces seuils commandent l'outil de nettoyage, plus bas dans la page.
Actions
Des boutons d'entretien en un clic.
- Vider le cache WebP : supprime les fichiers WebP produits.
- Régénérer les WebP (par lots de 500) : produit d'avance les WebP, jusqu'à 500 images à la fois.
- Écrire / retirer les règles de cache navigateur : écrit les règles de cache dans le
.htaccess, à l'intérieur d'un bloc réversible# BEGIN/END cll_perf(une sauvegarde.htaccess.cll_perf-bakest créée la première fois). GZIP et Brotli sont activés là où le module Apache est présent.
Nettoyage de la base de données (entretien)
Un nettoyage non destructif des données temporaires. Ce n'est pas le « mode maintenance » de la boutique : votre front office reste en ligne et aucun visiteur n'est bloqué.
- Exécuter (sinon simulation) : laissez décoché pour prévisualiser ; rien n'est supprimé tant que vous ne cochez pas.
- Faire aussi OPTIMIZE TABLE : récupère si vous le souhaitez l'espace des tables après le nettoyage.
- Lancer l'entretien : seules les données temporaires d'invités et de journaux plus anciennes que vos seuils sont concernées ; les commandes et les clients valides ne sont jamais touchés.
3. Vérifier que tout fonctionne
- Ouvrez le panneau État : l'interrupteur général doit être actif et le moteur WebP doit être annoncé comme disponible.
- Avec « Diffuser en WebP » activé, regardez le code source d'une fiche produit : les images doivent être enveloppées dans
<picture>avec une source.webp. - Lancez d'abord le nettoyage de la base en simulation : il annonce combien de paniers, de connexions et de lignes de journal seraient supprimés avant que vous exécutiez.
- Après avoir écrit les règles de cache navigateur, vérifiez la présence du bloc
# BEGIN cll_perfdans votre.htaccess.
4. Questions fréquentes
Une optimisation peut-elle casser mon thème ?
Les options « invasives » (combiner et minifier les CSS et JS, minifier le HTML, CSS critique) sont désactivées par défaut. Activez-les une par une et vérifiez ; servez-vous de la liste d'exclusions pour épargner une image qui pose problème.
Et si mon serveur ne sait pas produire de WebP ?
Le panneau État vous le dit. Si ni GD ni Imagick n'est disponible, la réécriture en WebP est simplement ignorée et les images d'origine sont servies.
Le nettoyage de la base est-il sans risque ?
Oui. Il est non destructif, propose toujours une simulation et ne supprime que les données temporaires d'invités et de journaux plus anciennes que vos seuils, jamais des commandes ni des clients valides.
Dois-je modifier mon thème ?
Non. Performance passe par les hooks standard et fonctionne avec n'importe quel thème.