Performances Web pour PrestaShop : comment optimiser la vitesse de chargement et le score PageSpeed de sa boutique eCommerce ?
Il y a de nombreux avantages à avoir une boutique en ligne qui se charge plus rapidement. Notamment, une meilleure expérience utilisateur et une augmentation des conversions.
Il existe plusieurs façons d’optimiser la vitesse de chargement de PrestaShop. Voici quelques-uns des moyens les plus courants et les plus faciles à mettre en œuvre.
1. Tester la vitesse de chargement de votre boutique PrestaShop
Avant de commencer à suivre ce tutoriel, testez la vitesse de chargement de votre boutique en ligne PrestaShop. Pour cela, vous pouvez utiliser Google PageSpeed Insights ou GtMetrix. Ces outils vous fourniront des données utiles pour vous aider à voir si les modifications que vous allez apporter auront un impact ou non sur votre e-commerce.
2. Activer les options de performances natives de PrestaShop
Tout d’abord, connectez-vous à votre tableau de bord Prestashop et rendez-vous dans l’onglet Paramètres avancés > Performances.
Le menu Performances de PrestaShop comporte quelques options qui peuvent être utiles d’activer et/ou de désactiver sur votre boutique en ligne pour en améliorer la vitesse de chargement.
Cependant, ce n’est pas une bonne idée d’activer toutes les options en même temps sans vérifier que totu est toujours fonctionnel sur votre e-commerce.
En suivant ce tutoriel, et à chaque fois que vous effectués des interventions de ce type sur votre CMS PrestaShop, vous devriez tester chaque option une à une pour voir comment elle affecte votre boutique en ligne.
Activation du cache (Smarty, fichiers…)
Dans la première section de la page Performances de votre boutique en ligne PrestaShop, vous pouvez définir les options comme ceci :
- Compilation des templates : choisissez “Ne jamais recompiler les fichiers de templates”
- Cache : passez le curseur sur Oui.
- Synchronisation multi-serveurs : laissez le curseur sur Non.
- Type de mise en cache : choisissez “Système de fichier”.
- Vider le cache : choisissez “Vider le cache chaque fois qu’il y a une modification”. Cette option fera en sorte que la mémoire cache soit vidée automatiquement après toute modification apportée sur votre boutique. Ainsi, vos clients pourront toujours voir les modifications les plus récentes de vos pages.
Activation du Smart Cache (CCC : Concaténation, Compression et mise en Cache)
Les options CCC permettent principalement de réduire le temps de chargement des pages (publiques) de votre boutique en ligne. Elles n’agissent pas sur votre tableau de bord. Les options CCC peuvent avoir un impact sur votre thème n’est pas compatible avec celles-ci. Pensez à vérifier après leur activation que tout est toujours fonctionnel sur votre boutique en ligne.
Il peut être utile d’activer le « Smart cache » pour vos feuilles de style ainsi que votre JavaScript. Cela devrait améliorer sensiblement le temps de chargement de votre boutique en ligne.
- « Smart cache » pour les feuilles de style : passez le curseur sur Oui.
- « Smart cache » pour le code JavaScript : passez le curseur sur Oui.
- Optimisation Apache : laissez le curseur sur Non.
Configuration CDN
La configuration d’un CDN peut également être un bon un moyen d’aider les boutiques en ligne PrestaShop à se charger plus rapidement. Lorsque vous utilisez un CDN, il réduit la distance entre le serveur Web et la personne qui visite votre site Web.
Même si ce n’est pas obligatoire, vous pouvez décider d’utiliser un CDN comme, par exemple, CloudFlare ou encore KeyCDN.
Activation et choix du cache
Enfin, dans la dernière section Cache de Performances de PrestaShop, nous vous recommandons d’opter pour le CacheApc. Pour cela, passer le curseur « Utiliser le cache » sur Oui et cochez CacheApc.
Si à côté de Apc vous avec l’avertissement « vous devez installer l’extension APC PCEL », comme ceci :
Il sera nécessaire, afin d’activer correctement le CacheApc, de cocher l’extension PHP apcu. Pour cela, connectez-vous à votre compte cPanel et rendez-vous dans Sélectionner une version de PHP.
3. Activer et configurer le Mod PageSpeed de votre Hébergement Web
Saviez-vous que votre Hébergement EasyHoster est hébergé sur des serveurs compatibles avec les PageSpeed Modules, autrement appelé le « mod_pagespeed ».
Il s’agit d’une « extension serveur » open source, officiellement partagée par Google pour permettre aux webmasters utilisant n’importe quel CMS (ou développement pur) de bénéficier des meilleures optimisations, et donc, des meilleures performances Web, ainsi que d’un excellent score PageSpeed !
Le Mod PageSpeed intègre pas moins de 70 filtres, qui peuvent agir sur de nombreux points d’optimisation du code, en vue d’éliminer les avertissements concernant les faibles performances des boutiques PrestaShop signalés par PageSpeed Insights.
Si vous avez bien activé les différents Systèmes de cache natifs de PrestaShop, mais que vos utilisateurs éprouvent toujours des lenteurs en visitant votre boutique eCommerce, la deuxième étape conseillée est d’activer, au cas par cas, les Filtres du Mod PageSpeed qui sont compatibles avec votre boutique.
Pour vous apprendre à activer et configurer le Mod PageSpeed, nous avons publié un long tutoriel, à l’origine pour WordPress / WooCommerce. Mais, puisque le Mod PageSpeed est compatible avec tous les CMS (PrestaShop y compris), vous pouvez vous y référer pour comprendre son fonctionnement et ainsi, améliorer drastiquement votre score PageSpeed sous PrestaShop :
En suivant ce lien, vous trouverez le code htaccess de démarrage pour l’activation et la configuration du mod_pagespeed sur votre boutique PrestaShop.
En prenant le temps d’activer/désactiver finement tous les filtres compatibles/incompatibles avec votre boutique eCommerce, vous serez assuré d’obtenir les meilleures performances et le meilleur score sur PageSpeed avec PrestaShop !
4. Vérifier la version de PHP
Assurez-vous d’utiliser la dernière version de PHP recommandée avec la version de votre boutique en ligne PrestaShop.
Par exemple, si vous êtes actuellement sur la version 7.2 de PHP avec la version 1.7.8 de PrestaShop, même si c’est bien un version PHP compatible, celle-ci est beaucoup moins performante que la version 7.4.
5. Vérifier la valeur définie pour Memory_limit
Suivez ce tutoriel pour savoir où aller pour connaitre la valeur de Memory_limit actuellement définie sur votre compte d’hébergement et en changer si nécessaire :
Voici les valeurs maximum que nous vous recommandons d’utiliser en fonction de votre plan d’hébergement :
- 256M pour l’offre Light
- 512M pour les offres Perso et Pro
- 768M pour les offres Pro+, Business et Performance
- 512M pour les offres Pro+ SEO et Business SEO
- 768M pour l’offre Performance SEO
Ne dépassez pas les valeurs conseillées pour chacun des plans EasyHoster car cela ne vous donnerait aucun bénéfice de performance supplémentaire mais pourrait générer aléatoirement des problèmes de type « Erreur 500 » sur votre boutique PrestaShop.
6. Activer la compression Gzip
Activer la compression Gzip dans cPanel peut se faire dans la section Optimize Website.
Cochez « Compressez les types MIME spécifiés« .
Voici la valeur à indiquer dans le champ MIME Types :text/html text/plain text/xml text/css text/javascript application/javascript application/xhtml+xml application/xml application/rss+xml application/atom_xml application/x-javascript application/x-httpd-php application/x-httpd-fastphp application/x-httpd-eruby image/svg+xml
7. Désactiver l’enregistrement des statistiques de PrestaShop
Prestashop a plusieurs système de statistiques intégrés pour recueillir des données sur vos visiteurs, vos pages et vos produits. En effet, le CMS enregistre toutes les connexions entrantes, ce qui peut ralentir les temps de chargement de votre e-commerce.
Nous vous recommandons de désactiver et de désinstaller certains des modules de statistiques de Prestashop. Voici la liste d’une partie des modules collectant des données et pouvant être remplacé par Google Analytics :
- Browsers and Operating Systems
- Visits and Visitors
- Page not founds
- Search engine keywords
- Visitors Online
- Visitors Origin
Bien sûr, n’hésitez pas à également désactiver les autres modules de collecte de statistiques dont vous n’auriez pas l’utilité :
- Available Quantities
- Best Categories
- Best Customers
- Best Suppliers
- Best Vouchers
- Best Selling Products
- Carrier Distribution
- Data mining for statistics
- Stats Dashboard
8. Supprimer les modules PrestaShop inutiles
Avez-vous installé un grand nombre de modules sur votre boutique en ligne PrestaShop ? Vous pouvez en voir la liste en allant dans l’onglet Personnaliser > Modules > Gestionnaire de modules.
Si certains de vos plugins ne sont pas essentiels à la rentabilité de votre ecommerce PrestaShop, vous pouvez les désactiver et les désinstaller.
9. Lancer un audit de performance gratuit avec PHP X-RAY
Afin de détecter quels sont les scripts et modules qui consomment le plus de ressources sur votre boutique en ligne PrestaShop, n’hésitez pas à lancer un audit de performance gratuit avec PHP-XRAY, en toute autonomie, depuis votre compte cPanel.
Cliquez sur Start Tracing.
Ensuite, sélectionnez le domaine pour lequel vous souhaitez lancer un scan. Dans le champ « Specify mask » renseignez une astérisque (*). Cochez la case « Advances settings ». Cochez « Time Period » et indiquez le chiffre 2 dans le champ « Days ». Terminez en cliquant sur le bouton Run.
Le scan va démarrer et examinez toutes les requêtes effectuées par votre boutique en ligne pour une durée de 2 jours. Pendant le scan, utilisez le plus possible votre boutique aussi bien en frontend qu’en backend afin de permettre à X-RAY de collecter le plus de données possible.
Pour visualiser le rapport en fin de scan, cliquez ici :
Seront indiqué, en rouge, les scripts et/ou plugins étant considérés comme lents / gourmands en ressources.
10. Vérifier le poids de la base de données MySQL
Attention, avant toute intervention réalisez une sauvegarde de votre base de données.
Il pourrait être intéressant de vérifier qu’il n’existe pas une fonctionnalité Prestashop ou une extension qui consommerait une quantité anormale de données.
Vous pouvez vérifiez le poids total de votre base de données dans votre compte cPanel > Base de données MySQL.
Ensuite, regardez sous le titre Base de données MySQL > colonne Taille.
Par exemple, une base de données dont le poids total est de plus de 800 Mo, est relativement conséquente, mais pas critique.
Toutes les pistes doivent êtres explorées pour vous permettre d’améliorer la vitesse de chargement de votre boutique en ligne PrestaShop.
Enfin, pour vérifier le poids de chaque tables MySQL si le poids de votre base de données vous semble anormal, rendez-vous dans votre compte cPanel > phpMyAdmin.
Ensuite, classez vos tables par taille afin de vérifier qu’aucune n’est surchargées.
Si vous avez désactivé les modules de collecte de statistiques comme conseillé dans ce tutoriel, envisagez également de vider le contenu des tables MySQL suivantes :
- PS_CONNECTIONS_SOURCE
- PS_CONNECTIONS
- PS_GUEST
- PS_PAGE_NOT_FOUND
11. Limiter les polices d’écriture & éviter les polices d’icônes
L’utilisation de nombreuses polices d’écriture (Google Font, par exemple) ainsi que de polices d’icônes externes peuvent générer des lenteurs et impacter le score Google PageSpeed de votre boutique en ligne.
Tenter de vous limiter à l’utilisation d’une seule police d’écriture. Évitez d’utiliser 1 police pour vos titres, 1 police pour vos textes, etc.
De même, plutôt que d’utiliser une police d’icônes comme Font Awesome, par exemple, essayez d’intégrer les icônes sont formes d’images (.png, .svg…).
12. Optimiser les images
Tout site Web doit s’assurer de téléverser des images de la bonne taille / dimensions, au bon format et compressées comme il se doit sans perte de qualité, et les boutiques PrestaShop n’échappent pas à la règle.
Si vous obtenez des avertissements similaires à ceux-ci en tester le score PageSpeed de votre boutique PrestaShop, il sera nécessaire d’optimiser vos images :
En effet, pour chaque page produits, vous devez bien sûr ajouter des photos du-dit produits. Mais si les photos sont trop grandes ou de trop haute qualité, la vitesse de chargement de votre site en sera impactée.
Dans votre tableau de bord PrestaShop, rendez-vous dans l’onglet Apparence > Images. Vérifiez que les paramètres de compression vous conviennent.
La section Images vous permet de choisir les différentes tailles des images que vos clients verront dans votre boutique. Par défaut, toutes les tailles d’images sont déjà configurées dans votre boutique. Ne les supprimez pas car vous en aurez probablement besoin.
PrestaShop va créer pour vous différentes tailles de votre image lorsque vous la téléchargez dans votre bibliothèque média. Vous n’avez besoin de télécharger qu’une seule version de votre image, qui sera automatiquement redimensionnée dans toutes les tailles requises par PrestaShop (vignette, miniature,…).
Si vous souhaitez compresser vos images sans perte de qualité, vous pouvez utilisez un outil comme TinyPNG.
Veillez aussi à utiliser une taille d’image adéquate. Par exemple, n’utilisez pas des images qui font 2400px (et plus) de large. Selon nous, c’est trop large. 1800px maximum serait optimal (même en retina ready), sans perte de qualité à l’oeil nu.
13. Activer le Lazy Load des images
Une autre optimisation indispensable sur Internet aujourd’hui serait d’activer le Lazy Load, afin de ne télécharger que les images qui sont réellement affichées, au moment où elles sont nécessaires.
Vérifiez si votre thème PrestaShop permet d’activer cette option de chargement des images ou contactez le développeur de votre thème qui pourra peut-être vous aider.
14. Vérifier les performances du thème PrestaShop
Si malgré toutes les optimisations que vous avez mises en place vous n’êtes toujours pas satisfait de la vitesse de chargement de votre boutique en ligne PrestaShop, pensez à tester avec Google PageSpeed Insights ou GtMetrix la version Demo de votre thème sur leur site officiel.
Si ses performances ne sont déjà pas excellentes, vous pourriez envisager de changer de thème. Comme vous le savez sans doute déjà, le choix du thème d’une boutique PrestaShop a un impact important sur les performances finales de l’e-commerce.
15. Mettre à jour la version de PrestaShop
Si actuellement, vous n’êtes pas sur la dernière version stable de PrestaShop, pour des performances optimales, il serait vraiment nécessaire de mettre à jour votre CMS. N’oubliez pas, hélas, que même si les mises à jour de PrestaShop sont plus complexes que celles de WordPress celles-ci restent néanmoins nécessaires après un certain temps.
Des questions ? Besoins de conseils personnalisés sur les performances de votre e-commerce Prestashop ?
Après avoir suivi ce tutoriel, si vous avez des questions ou si vous rencontrez des difficultés dans l’application de l’un de ces points, n’hésitez pas à ouvrir un ticket auprès du support technique EasyHoster. Votre réussite étant notre priorité, nos techniciens sont toujours disponibles pour vous assister et répondre à vos questions.
