Ce qu'il faut retenir
- Les images sont responsables de la majorité des sites lents. C’est aussi le problème le plus rapide à corriger.
- Le JavaScript coûte deux fois : au téléchargement, puis à l’exécution sur un téléphone bien moins puissant que ton ordinateur.
- Teste sur un vrai téléphone en 4G, pas sur ta fibre. L’écart est brutal.
- Corrige dans l’ordre du coût : images, puis hébergement, puis JavaScript. Pas l’inverse.
Un site lent fait fuir les visiteurs avant même qu’ils aient lu une ligne. Et dans la quasi-totalité des cas que je vois, les causes sont les mêmes, dans le même ordre.
Voici les huit coupables habituels, classés du plus fréquent au moins courant, avec pour chacun ce qu’il coûte réellement et combien d’effort il faut pour le corriger.
1 à 3 : les images, toujours les images
Des fichiers trop lourds. Une photo sortie d’un appareil fait 4 à 8 Mo. Affichée dans un bloc de 600 pixels de large, elle devrait en peser 60 à 120 Ko. Le navigateur, lui, télécharge les 8 Mo.
Le mauvais format. Le WebP pèse 25 à 35 % de moins que le JPEG à qualité identique, et il est supporté partout depuis des années.
Pas de dimensions déclarées. Sans attributs width et height, la page saute pendant le chargement. C’est désagréable et ça fait cliquer à côté.
4 et 5 : le JavaScript qu’on ne regarde jamais
Des librairies pour trois lignes. Charger 80 Ko de JavaScript pour animer un menu, c’est courant. Une poignée de lignes natives suffisent souvent.
Tout charger d’un coup. Le code du formulaire de contact n’a aucune raison d’être téléchargé sur la page d’accueil. Découper le bundle par page change tout sur mobile.
6 et 7 : l’hébergement et les scripts tiers
Un serveur sous-dimensionné. L’hébergement mutualisé à 3 € par mois partage une machine entre des centaines de sites. Le temps de réponse s’en ressent dès qu’un voisin a un pic.
Les scripts tiers. Chat en ligne, bandeau cookies, pixels publicitaires, polices externes : chacun ajoute une connexion et du code à exécuter. Cinq scripts tiers peuvent doubler le temps d’affichage.
8 : le cache mal configuré
Sans en-têtes de cache corrects, le navigateur retélécharge tout à chaque visite : logo, polices, feuilles de style. Bien réglé, un visiteur qui revient ne recharge quasiment rien.
C’est une configuration serveur de quelques lignes, et c’est probablement le meilleur rapport effort / gain de toute cette liste.
Par où commencer concrètement
Ouvre ton site sur ton téléphone, en 4G, connexion Wi-Fi coupée. Chronomètre jusqu’à ce que le texte principal s’affiche. Au-delà de trois secondes, il y a un vrai sujet.
Ensuite, lance un rapport Lighthouse depuis Chrome. Il te donnera la liste triée. Attaque les images d’abord : c’est là que le gain est le plus gros pour le moins de travail.
On en parle ?
Si tu as un projet en tête ou juste une question, un premier appel de trente minutes suffit souvent à y voir clair. C’est gratuit et sans engagement : on regarde ta situation, et je te dis franchement si je suis la bonne personne.