Optimiseur d’images WebP & AVIF — Guide complet

Présentation

L’Optimiseur d’images WebP & AVIF convertit et compresse les images de votre boutique directement sur votre serveur, puis sert automatiquement à chaque visiteur le format le plus léger que son navigateur sait afficher. Toute la conversion est locale : aucune image n’est envoyée vers un service tiers, il n’y a ni quota ni crédits.

Point essentiel : vos fichiers originaux ne sont jamais écrasés. Pour chaque image produit.jpg, le module génère produit.jpg.webp et produit.jpg.avif à côté de l’original, puis les sert uniquement aux navigateurs compatibles. L’opération est donc entièrement réversible. Le module est compatible PrestaShop 1.7.6, 8 et 9, et fonctionne avec Imagick, GD ou les binaires cwebp et avifenc.

Prérequis et compatibilité

• PrestaShop — 1.7.6 à 9.x, y compris en multiboutique.
• PHP — 7.2 à 8.3.
• Au moins un moteur d’image — l’extension Imagick (recommandée, compilée avec le support WebP/AVIF), ou l’extension GD avec le support WebP/AVIF, ou les binaires système cwebp et avifenc.
• Serveur web — Apache (livraison .htaccess transparente) ou Nginx (mode picture).

Installation

1. Depuis le back-office, ouvrez Modules > Gestionnaire de modules.
2. Cliquez sur Installer un module et déposez l’archive ZIP du module.
3. Une fois l’installation terminée, cliquez sur Configurer.

À l’installation, le module crée ses deux tables (statistiques et file d’attente), enregistre ses hooks, applique des réglages par défaut prêts à l’emploi et, si le mode de livraison .htaccess est actif, écrit son bloc de règles dans le dossier /img. La présence d’au moins une librairie image (GD ou Imagick) est vérifiée : si aucune n’est disponible, l’installation est interrompue avec un message explicite.

Premiers pas

Trois étapes suffisent pour optimiser tout votre catalogue existant :

1. Testez les moteurs — sur la page de configuration, cliquez sur Tester les moteurs pour confirmer que le WebP et l’AVIF peuvent être produits.
2. Analysez la médiathèque — cliquez sur Analyser la médiathèque : le module parcourt les dossiers cibles et remplit la file d’attente avec les images à traiter.
3. Lancez la conversion — cliquez sur Lancer la conversion : le traitement s’effectue par lots, avec une barre de progression, et peut être mis en pause puis repris à tout moment.

Les nouvelles images ajoutées ensuite dans le back-office sont converties automatiquement (voir Conversion automatique à l’upload).

Configuration

La page de configuration réunit un tableau de bord (capacités du serveur et économies réalisées), l’outil de traitement en masse, le formulaire de réglages et un panneau de maintenance.

Formats next-gen

• Générer le WebP — active la création des fichiers .webp.
• Qualité WebP — de 1 à 100. La plage 80–85 offre le meilleur compromis qualité/poids.
• Générer l’AVIF — active la création des fichiers .avif.
• Qualité AVIF — l’AVIF est plus dense que le WebP : une valeur de 45 à 55 suffit généralement pour une excellente qualité.

Moteur & livraison

• Moteur de conversion — Automatique (recommandé), Imagick, GD ou Binaires. En mode automatique, le module choisit le meilleur moteur disponible pour chaque format, dans l’ordre Imagick, puis GD, puis binaires.
• Mode de livraison — .htaccess (négociation Apache transparente), picture (réécriture HTML pour Nginx) ou aucun. Sur Apache, laissez .htaccess : il n’y a rien d’autre à faire. Sur Nginx, choisissez picture.

Chargement différé (lazy-load)

• Lazy-load natif — ajoute loading="lazy" et decoding="async" aux images, sans JavaScript et sans impact SEO.
• Effet de fondu — un léger fondu cosmétique à l’apparition de l’image (optionnel).

Compression des originaux

• Recompresser les originaux — réenregistre les JPEG/PNG d’origine en version optimisée. Une sauvegarde .dforig est conservée pour permettre la restauration.
• Qualité JPEG (originaux) — la qualité appliquée lors de la recompression des JPEG d’origine.

Périmètre

• Types d’images à traiter — produits, catégories, fabricants, fournisseurs, magasins et pages CMS. Les types réellement disponibles sur votre installation sont détectés automatiquement.
• Images du thème — traite aussi le dossier assets/img de votre thème (et y gère un .htaccess dédié en livraison Apache).
• Exclure — un motif par ligne : tout chemin contenant l’un de ces fragments est ignoré (par exemple logo ou /img/cms/banner).

Avancé

• Conversion auto à l’upload — convertit chaque image produit dès sa (re)génération dans le back-office.
• Ignorer les images animées — les GIF et PNG animés (APNG) sont détectés et laissés intacts.
• Taille minimale (octets) — en dessous de ce poids, l’image est ignorée : les très petites images ne gagnent rien à être converties.
• Taille des lots — le nombre d’images traitées par requête AJAX ou par passage de cron. 10 à 30 est conseillé sur hébergement mutualisé.

Comment fonctionne la livraison

Le module ne fait que générer les fichiers next-gen et indiquer au serveur comment les servir. Les URLs de vos images ne changent jamais.

Mode .htaccess (Apache)

Le module écrit un bloc de règles dans /img/.htaccess. Lorsqu’un navigateur demande produit.jpg, le serveur lit l’en-tête Accept : s’il annonce le support de l’AVIF et que produit.jpg.avif existe, c’est ce fichier qui est renvoyé ; sinon le WebP est tenté, puis à défaut le JPEG d’origine. Un en-tête Vary: Accept est ajouté pour que les caches et les CDN conservent la bonne version par navigateur. Tout est transparent : votre thème n’est pas modifié, et rien ne casse si vous désactivez le module.

Mode picture (Nginx)

Sur les serveurs Nginx, la négociation par .htaccess n’est pas disponible. Le mode picture réécrit alors les balises img de la page en picture avec des sources AVIF et WebP, juste avant l’envoi de la page. Le navigateur choisit lui-même la première source qu’il sait afficher.

Optimiser un gros catalogue (CRON et CLI)

L’outil de traitement en masse en AJAX convient à la plupart des boutiques. Pour des milliers d’images ou pour automatiser la prise en charge des nouvelles images, utilisez le cron ou la ligne de commande.

Tâche CRON

Programmez une requête régulière vers l’URL affichée dans le panneau Automatisation de la configuration. Elle est sécurisée par un jeton :

https://votre-boutique/index.php?fc=module&module=datafireflyimageoptimizer&controller=cron&token=VOTRE_JETON&scan=1&limit=200

Le paramètre scan=1 relance une analyse avant le traitement (utile pour détecter les nouvelles images) et limit fixe le nombre d’images traitées par passage.

Commande CLI

Pour les très grandes médiathèques, la commande en ligne traite la file en arrière-plan, sans timeout :

php modules/datafireflyimageoptimizer/cli/optimize.php --scan --loop

Options disponibles : --scan (analyser avant de traiter), --loop (continuer jusqu’à vider la file), --limit=N (taille des lots), --types=products,categories (restreindre les cibles pour cette exécution), --force (forcer la reconversion même si les fichiers next-gen sont à jour) et --quiet (sortie minimale).

Restauration et réversibilité

Comme les originaux ne sont jamais écrasés, vous pouvez revenir en arrière à tout moment. Dans le panneau Maintenance, le bouton Tout restaurer supprime les fichiers .webp et .avif générés, restaure les originaux recompressés depuis leur sauvegarde .dforig, retire le bloc .htaccess et vide les statistiques. Le même panneau permet aussi de régénérer le .htaccess si nécessaire.

Désinstallation

La désinstallation retire le bloc .htaccess, supprime les tables et la configuration du module. Les fichiers .webp et .avif déjà générés restent sur le disque. Pour repartir d’une médiathèque propre, utilisez d’abord Tout restaurer dans l’onglet Maintenance, puis désinstallez le module.

Dépannage

• Le test des moteurs échoue pour l’AVIF — votre Imagick/GD n’est probablement pas compilé avec le support AVIF. Installez les binaires avifenc, ou désactivez l’AVIF et conservez le WebP.
• Page blanche en façade après activation — c’est généralement lié au mode picture sur un thème très personnalisé. Repassez en mode .htaccess (Apache) ou aucun, puis contactez le support.
• La conversion est lente — réduisez la taille des lots, ou déportez le traitement sur le cron ou la CLI, conçus pour les gros volumes.
• Certaines images ne sont pas converties — vérifiez qu’elles dépassent la taille minimale, qu’elles ne sont pas animées (si l’option est active) et qu’aucun motif d’exclusion ne les concerne.

FAQ

Mes images sont-elles envoyées vers un service externe ?

Non. Toute la conversion est 100 % locale, sur votre serveur. Aucune image n’est transmise à un tiers, il n’y a ni quota ni crédits.

Mes fichiers originaux sont-ils modifiés ?

Non par défaut : les versions WebP et AVIF sont créées à côté de l’original. Si vous activez la recompression des originaux, une sauvegarde .dforig est conservée pour les restaurer.

Dois-je modifier mon thème ou mon serveur ?

En mode Apache, non : le bloc .htaccess s’occupe de tout. Sur Nginx, activez simplement le mode picture dans les réglages.

Quels formats sont pris en charge ?

Le module génère du WebP et de l’AVIF à partir de vos JPEG, PNG et GIF (non animés).

Est-ce compatible PrestaShop 9 et le multiboutique ?

Oui, le module est compatible PrestaShop 1.7.6 à 9.x et fonctionne en contexte multiboutique. Il utilise exclusivement des hooks officiels.

Comment traiter un catalogue de plusieurs milliers d’images ?

Lancez l’analyse puis la conversion par lots en AJAX, ou programmez la tâche CRON ou la commande CLI, qui traitent la file en arrière-plan sans timeout.