La vitesse d’un site internet agit directement sur le confort des utilisateurs. On sait qu’un site internet lent réduit significativement le temps passé par les visiteurs sur celui-ci. Cela affecterait également le référencement. L’optimisation de la vitesse de votre site est donc un élément majeur à ne surtout pas négliger.
Les causes des lenteurs
Contrairement aux idées reçues, la lenteur d’un site ne provient pas systématiquement de la lenteur du serveur qui l’héberge. Bien-sûr, un serveur surchargé ou de piètre qualité peut causer des lenteurs, mais HaiSoft fait tout pour éliminer cette possibilité.
En effet, nous mettons tout en oeuvre pour que vous profitiez en permanence d’un hébergement rapide et disponible : L’ensemble des serveurs mutualisés HaiSoft ainsi que tous les nouveaux serveurs sont livrés en SSD pour des performances maximales et constantes. De plus, les serveurs sont activement monitorés de sorte à ce qu’une charge importante soit immédiatement identifiée et le souci très rapidement réglé. Les hébergements HaiSoft, sont donc un excellent moyen de bénéficier de performances exceptionnellement bonnes en toutes circonstances. Voir notamment :
Dans un tel contexte, nous constatons que les demandes concernant des lenteurs sur les sites web sont dans la vaste majorité des cas dus à un manque d’optimisation des dits sites, d’où l’utilité de cet article.
Qu’est-ce que l’optimisation ?
La durée d’affichage d’un site est déterminée par deux points principaux :
- Les ressources CPU -processeur- utilisées sur le serveur, généralement par les scripts PHP et la base de données MySQL durant les chargements des pages du site.
- Les ressources envoyées vers les visiteurs du site par le serveur, c’est à dire les médias, images, scripts, etc.
L’optimisation va donc consister à agir sur ces deux points pour d’une part générer les pages rapidement côté serveur, et d’autre part que les utilisateurs reçoivent les pages rapidement, quelle que soit la vitesse de leur connexion internet.
Vous trouvez ce blog rapide ? Sachez qu’il est actuellement hébergé sur serveur mutualisé HaiSoft et que nous y avons appliqué les optimisations recommandées dans cet article.
1) Optimisation des ressources serveur
NB : Nous parlerons ici principalement de l’optimisation des CMS, même si certains conseils sont généralisables à tous les cas de figure. Nous n’adopterons pas dans cet article le point de vue d’un développeur, qui doit normalement avoir la notion de ce qu’est un code optimisé.
Le temps de chargement d’une page de votre site est directement liée à la puissance de calcul requise pour la générer. Il est donc important de s’assurer que le code PHP générant les pages soit le plus optimisé possible afin d’offrir un temps de chargement correct.
Par ailleurs, un site pas ou mal optimisé peut dans certains cas extrêmes aller jusqu’à ralentir un serveur complet. Si par exemple chaque page entraîne des requêtes MySQL très longues (plus de 20 secondes) et que le site reçoit plusieurs visites par seconde, l’utilisation CPU du serveur peut vite atteindre les 100% et les performances vont se dégrader dramatiquement, voir le serveur peut cesser de répondre si les limites d’utilisation définies sur les différents services du serveur sont trop grandes. C’est en effet là qu’interviennent certaines limites mises en place sur les serveurs MySQL et Apache, qui visent à préserver l’accès au serveur en évitant sa saturation complète.
En outre, il faut bien comprendre que PHP n’utilise qu’un seul coeur de processeur par process (et donc par page chargée). Cela signifie que le temps de chargement des pages de votre site ne sera pas plus rapide avec 8 coeurs qu’avec 2 coeurs s’il n’y a qu’un seul visiteur (et en considérant que les autres process ne saturent pas les ressources restantes), mais en revanche, vous pourrez accueillir plus de visiteurs simultanément sans ralentissements. L’utilisation de CPU par MySQL est aussi à prendre en compte, si une requête parcourt des millions de colonnes, elle prendra plusieurs longues secondes à s’exécuter ce qui chargera le serveur et ralentira votre site.
Erreurs et mauvaises pistes à éviter
Afin de gagner du temps, commençons par ce qu’il faut éviter.
- Garder un site non à jour avec une version de PHP osbolète : Outre le problème de sécurité dramatique occasionné, vous divisez potentiellement par 1,5 à 3 les performances de votre site. Pour rappel, les dernières versions de PHP sont toujours disponibles chez HaiSoft et vous pouvez upgrader à tout moment.
- Commencer par installer des plugins de cache (WPSupercache, WPRocket…) à la moindre lenteur. En cas de lenteur importante, il faut d’abord prendre le problème à sa source, se demander d’où vient cette lenteur et non pas utiliser directement un paliatif généralement bien moins efficace qu’une réelle optimisation. Il convient donc de commencer l’optimisation sans plugin de cache et de terminer par cette étape qui doit rester la « cerise sur le gâteau » finale. Non-seulement les plugins de cache ne peuvent pas tout mettre en cache (certaines requêtes lentes peuvent subsister), mais ils peuvent également générer de nombreux problèmes lors du développement; raison de plus pour réserver cette étape pour la fin.
Voyons désormais les bonnes pistes à suivre pour optimiser votre site.
Mises à jour
Assurez-vous que votre CMS soit bien à jour, de même que tous ses thèmes, modules, extensions etc.
Profitez notamment de la mise à jour automatique de votre site WordPress via votre panneau de contrôle Plesk, disponible avec nos formules WordPress.
Version de PHP
Assurez-vous d’utiliser la dernière version de PHP supportée par votre script et votre hébergeur. Chez HaiSoft, votre version de PHP est réglable via votre Panneau de contrôle Plesk, et nous supportons les nouvelles versions de PHP dès leur sortie. Un site web à jour supportera les dernières versions de PHP, qui sont plus rapides et plus sécurisées. Nous estimons que PHP 5.6 est 2x plus performant que PHP 5.3. Et PHP 7.1 est 2x plus performant que PHP 5.6, il faut donc commencer par là !
Plugins et extensions
Cause n°1 des lenteurs sur les sites, il faut être très vigilant sur les modules installés sur votre site.
- Limitez autant que possible le nombre de plugins/extensions/modules installés, chaque module est une source de ralentissement supplémentaire. Supprimez régulièrement les plugins inutiles ou obsolètes.
- Vérifiez que vous n’avez pas de plugins ou modules trop gourmands en performances. Pour cela, désactivez tous les modules, vérifiez la vitesse du site, puis réactivez-les progressivement pour trouver le ou les plugins qui ralentissent le site. Pour WordPress, le plugin « Query Monitor » vous aidera à mesurer précisément le temps de chargement des pages et à déceler certains éléments gourmands en ressources. Et faites de même avec les plugins d’optimisation, vous pourriez être étonné de voir à quel point certains d’entre eux peuvent parfois ralentir votre site.
- Même recommandation pour les thèmes : Assurez-vous d’utiliser un thème optimisé qui ne ralentisse pas votre site, faites des essais avec d’autres thèmes pour comparer.
Les « builders » de sites
Les « builders » sont le piège moderne, en particulier pour WordPress. Les « builders » pour CMS (à ne pas confondre avec les builders externes, qui génèrent du code HTML fie et n’ont donc pas ce souci d’optimisation) font la promesse de faire un site sur mesure rapidement et efficacement.
Problème : Les builders consomment énormément de ressources MySQL et PHP.
Ils génèrent des requêtes MySQL et des calculs de page à rallonge qui ralentissent fortement le site. Chaque élément est un shortcode qui doit être converti par PHP en code PHP plus complet, puis en HTML, ce qui induit dans certains cas une dramatique perte de vitesse. J’insiste, car nous avons mesuré une différence d’un facteur 3 à 4 pour la plupart des « builders » en vogue : Un site prenant 0.3s à charger sur le thème par défaut de WordPress prend ainsi plus d’une seconde à charger lorsque le thème avec builder est sélectionné. Sur un site prenant déjà 1s à charger, vous passez à plusieurs secondes d’attente pour le visiteur, sans compter le temps d’envoi des données. Cela peut être très gênant dans certains cas.
Les builders peuvent aussi entraîner de nombreux bugs et ne peuvent pas être changés simplement – il faut refaire tout le site, les pages étant stockées de manière non native à WordPress-.
Réfléchissez donc bien au choix de votre builder et privilégiez les thèmes natifs qui sont bien plus simples, stables, versatiles et performants.
Contenu de vos pages
Est-il vraiment nécessaire de charger l’aperçu de 300 articles sur votre page d’accueil ? De charger les extraits des articles ? De charger les 100 derniers commentaires dans un widget ? Aucun serveur ne peut afficher une telle page de CMS rapidement sans cache, le chargement des pages étant limité à un seul coeur de processeur par page.
Sous WordPress, nous avons constaté un gain de vitesse conséquent rien qu’en désactivant les extraits d’articles sur la page d’accueil. Ainsi, il est conseillé de choisir des titres et des images explicites et de réduire autant que possible (voir supprimer) les extraits du contenu de l’article, car ce sont autant de requêtes MySQL en moins qui sont effectuées. Nous conseillons aussi d’éviter la multiplication de widgets inutiles. Un site simple est parfois plus attractif pour les visiteurs, il est en tout cas pour sûr plus rapide à exécuter pour le serveur.
Globalement, le plus important est de prêter une attention particulière sur l’optimisation des pages les plus visitées, notamment la page d’accueil.
Bases de données MySQL
La rapidité d’exécution des requêtes MySQL de votre site va directement influer sur la vitesse de celui-ci. Il est possible d’agir sur ce point, même sans connaissances spécifiques à MySQL. Néanmoins, nous recommandons toujours une grande prudence lors de la manipulation de votre base de données : exportez des dumps, faites des sauvegardes avant toute modification ! Cela se fait en quelques clics depuis votre panneau de contrôle Plesk, fourni par HaiSoft.
- Réduisez le volume de votre base de données : Plus la base de données MySQL est petite, plus les performances seront bonnes.
- Si votre base de données contient des logs de connexion ou autres, trouvez le moyen de la nettoyer périodiquement (via le backoffice, via un plugin, ou manuellement via PHPMyAdmin par exemple).
- La base de données d’un CMS (sauf exceptions où il y a réellement beaucoup de données, sur un site journalistique par exemple) ne devrait pas excéder les 100Mo grand maximum.
- Vérifiez le contenu des commentaires qui peuvent contenir des spams, vérifiez les paramètres d’inscription et la politique d’acceptation des commentaires sur le site.
- Pour les sites comme WordPress, voyez pour effacer les anciennes révisions des articles et pour nettoyer les « Transients » à l’aide d’un plugin.
- Si vous êtes sur serveur dédié ou VM, contactez votre service d’infogérance HaiSoft s’il est possible d’augmenter la mise en RAM de votre base de données si les capacités de votre serveur le permettent; dans certains cas cela peut apporter un gain.
2) Optimisation ressources client
La taille d’une page, le nombre de ressources chargées, leur provenance, la taille des images et leur compression, sont autant de paramètres qui entrent en jeu dans la vitesse de chargement d’un site.
Mesure d’optimisation avec GTMetrix
Nous vous conseillons la lecture de notre article dédié pour maîtriser cet outil :
Le site https://gtmetrix.com/ permet d’analyser dans le détail les performances de votre site du point de vue des visiteurs.
Avant toute opération d’optimisation des ressources, nous conseillons de réaliser ce test afin de vous donner une bonne idée des éléments à travailler mais également pour suivre la progression des optimisations apportées.
Nous allons vous détailler quelques recommandations les plus fréquentes dans cet article, mais la liste n’est pas exhaustive et nous vous invitons à compléter vos recherches si besoin.
Taille globale de la page
Il faut penser que chacun n’a pas une connexion internet rapide ou un périphérique performant (mobile ou autre) pour visionner votre site.
- Nous conseillons dans la mesure du possible de rester autour des 1Mo maximum pour votre page, de sorte qu’une connexion à même à seulement 2Mbit/s charge la page en 5s environ.
- Si votre site est très « graphique » et comporte de grandes images, vous pouvez éventuellement monter à une taille de page de 2Mo.
- Si vous avez un site de photographie, alors il n’y a plus vraiment de normes, mais l’idéal est d’avoir un aperçu des images compressé et possibilité d’agrandir les images en bonne qualité.
- Si vous insérez des vidéos, sauf exception, mieux vaut utiliser un site externe (YouTube, Vimeo, etc.) qui sera très doué pour proposer différentes qualités et compresser la vidéo comme il se doit.
Nombre de requêtes externes
Il s’agit requêtes faites à la visite de votre site, pour charger des ressources qui ne proviennent pas de votre site. Les ressources externes sont généralement coûteuses en temps de chargement pour le visiteur.
Elles proviennent principalement de thèmes et plugins modifiant l’apparence de votre site, et contiennent surtout des polices, des scripts JS et du CSS.
Une ressource externe entraîne que pour chaque site contenant une ressource, une requête DNS supplémentaire sera effectuée par le visiteur. Ces requêtes prennent quelques millisecondes, qui mises bout à bout peuvent prendre un temps non négligeable, en tout cas pour le premier chargement de page.
De plus, les serveurs externes peuvent être basés loin du pays du visiteur, augmentant la latence et abaissant le débit.
Il faut donc essayer de minimiser autant que possible les ressources externes chargées. Celles-ci sont bien-sûr indiquées par GTMetrix dans le rubrique « YSlow » et « Make fewer HTTP requests » ainsi que dans le « Waterfall ».
Idéalement, il faudrait ne charger aucune ressource externe, mais cela est quasiment impossible avec un CMS moderne. Le seuil à éviter de dépasser est donc 30 ressources externes comme absolu maximum, avec idéalement moins de 10 requêtes externes.
Pour cela, il faut parfois sélectionner d’autres thèmes et plugins qui stockent ces ressources localement.
Nombre total de requêtes
Chaque ressource génère un petit temps de latence. S’il y a trop de ressources, différentes, le site est ralenti, en particulier sur les connexions ayant un ping (temps de latence) important.
Cette valeur est indiquée en haut à droite du test GTMetrix : « Requests »
Nous conseillons d’essayer de rester sous la barre des 100 requêtes comme absolu maximum avec idéalement moins de 50 requêtes.
La concaténation des scripts est une méthode permettant de réduire le nombre de fichiers scripts envoyés et donc le nombre de requêtes. C’est une piste à explorer, mais pas la seule : Il faut choisir des scripts efficaces qui n’ont pas besoin de trop nombreux fichiers pour fonctionner. Cela peut se mettre en place via des scripts de mise en cache. Les plugins de cache vont ensuite généralement se charger de la concaténation et compression des scripts.
Mise à l’échelle des images
Il faut tenter, dans la mesure du possible, de ne charger dans le site que des images à la taille finale à laquelle elles seront affichées.
Il va de soi que par exemple, mettre une image haute résolution en miniature d’un article n’est pas optimal, pourquoi charger une image de 8Mo en haute résolution alors qu’une image de quelques Kilo Octets en 128×128 aurait peut-être suffit ?
Par chance, la plupart des CMS y-compris WordPress qui a longtemps été en retard sur ce sujet, gèrent les miniatures et sont capables de générer différentes tailles d’images puis d’utiliser la bonne en fonction du contexte. Il faut cependant s’assurer que le thème exploite ensuite correctement ces miniatures. Si ce n’est pas le cas, il faut redimmensionner manuellement les images.
Certains plugins proposent d’effectuer cette tâche : Je vous conseille de sauvegarder vos fichiers et votre base de données avant cette opération qui est risquée pour la qualité des images en ligne.
Via GTMetrix, cette information se situe dans « PageSpeed » rubrique « Serve scaled images ».
Sur serveur VM et dédié, cela peut être aidé par le module Google PageSpeed intégrable à Plesk. Le module peut convertir à la volée et à la taille de l’écran les images du site (pour peu que la taille des images ne soit pas trop importante à la base). Cela peut être mis en place par votre support et nécessitera de votre part la mise en place d’une clé API Google pour fonctionner.
Optimisation de la compression des images
Il est recommandé d’utiliser un bon taux de compression des images ainsi que des formats modernes.
Comme pour la mise à l’échelle, le module « PageSpeed » (VM et dédiés uniquement) peut aider sur ce point. Certains plugins ou scripts peuvent aussi s’en charger, il est dans ce cas conseillé de backuper votre site au préalable, car ces compressions peuvent parfois dénaturer vos images.
Conclusion
Ces quelques conseils couvrent les cas les plus fréquents et devraient vous permettre d’améliorer drastiquement les performances de votre site et/ou serveur, d’améliorer l’expérience utilisateur et ainsi maximiser la rétention des visiteurs. Ceci n’est qu’un début, il existe des milliers d’autres moyens d’optimiser un site, spécifiques à chaque contexte. Pour cette raison, nous vous conseillons de ne pas vous limiter à cette initiation mais de pousser vos recherches encore plus loin, en particulier sur les sites à fort traffic où l’optimisation peut faire absolument toute la différence.
Besoin de plus de puissance ?
Les performances de votre site ne vous conviennent toujours pas en suivant ce guide ?
- Pas encore client HaiSoft ? Contactez notre service commercial, voir https://www.haisoft.fr/
- Client HaiSoft : Contactez votre support HaiSoft par ticket ou téléphone afin de trouver la solution