3 solutions pour booster la vitesse d’un site
Vous avez des problèmes de performance web liés à un fort trafic ou plus globalement à votre bande passante ?
Pas de panique, voici quelques astuces pour réduire les flux entre un site et le navigateur du visiteur et ainsi booster la vitesse d’un site web.
Temps de connexion et temps de latence : les différents composants de la vitesse d’un site
Un navigateur Internet doit recevoir l’ensemble du code HTML (DOM) du serveur avant de pouvoir afficher le contenu. Pour chaque élément, contenu, image, vidéo…, le navigateur se connecte au serveur grâce au protocole TCP/IP. C’est le temps de connexion.
À cela, il faut ajouter le temps de latence du serveur qui ne répondra pas toujours instantanément, car il traite les demandes dans l’ordre d’arrivée. Ces temps sont irréductibles.
Sur une page HTML classique, 70% du temps d’affichage n’est pas lié au temps de téléchargement, mais au temps nécessaire à la connexion auquel s’ajoute le temps de latence.
Pour booster la vitesse d’un site et optimiser sa performance web, il est donc nécessaire de réduire le nombre de requêtes au serveur et pour cela de limiter l’utilisation de la bande passante.
Booster la vitesse d’un site en réduisant la bande passante
Il existe 3 solutions pour réduire la bande passante.
1- Utiliser le cache
Les systèmes de cache évitent de recharger des éléments déjà téléchargés. Ceci permet des allers-retours serveur beaucoup plus rapides ou même de les éviter.
Par défaut, la balise HTTP Etag (entity tag) est activée, elle aide à ne pas télécharger deux fois les mêmes fichiers. Ce système n’évite pas les allers-retours client-serveur, mais il évite de renvoyer le contenu des fichiers, et donc de trop consommer de bande passante et de limiter le traitement que doit effectuer le serveur.
Pour vous accompagner dans la mise en place de cette solution, essayez https://varnish-cache.org/
2- Réduire le nombre de fichiers envoyés
Plusieurs options s’offrent à vous pour réduire le nombre de fichiers, on vous en propose deux :
- Limiter le nombre de fichier CSS et JS : Il est possible de regrouper les fichiers CSS ou JS en un seul. Plusieurs outils sont disponibles en ligne.
- Regrouper les images – Sprite : Vous pouvez appliquer la méthode « Sprite » : il s’agit ici de regrouper les images du thème qui sont couramment utilisées en une seule. L’avantage est de n’utiliser qu’un nombre réduit d’images. En revanche, il faudra, via une feuille de style, afficher l’image en arrière-plan et la positionner.
3- Réduire la taille des fichiers
Les solutions sont différentes selon le type de fichier :
- Réduire la taille des images : Si vous avez des images qui ne font pas partie intégrante du thème, vous devez les réduire au maximum et éviter de charger des images trop grandes. Il est préférable de les réduire ou d’utiliser des mécanismes automatiques de mise à l’échelle.
- Limiter le poids des fichiers : Deux moyens sont possibles :
- Compression Gzip : Les fichiers HTML, CSS et JavaScript sont des fichiers texte particulièrement adaptés à une compression ZIP importante. Le temps nécessaire à cette décompression est négligeable pour le visiteur. En réduisant les flux envoyés aux utilisateurs, vous réaliserez une économie de bande passante et booster la vitesse d’un site.
- Minify : Une autre possibilité pour limiter le poids de vos fichiers CSS et JavaScript est de les minimiser. La minimisation supprime les retours à la ligne, les tabulations, ainsi que les commentaires. La lecture de ces fichiers devient donc quasiment impossible, mais ce n’est pas un problème en production. Pour vous aider dans cette démarche, vous pouvez essayer https://www.minifier.org/
Grâce à ces différentes solutions, vous allez optimiser l’utilisation de la bande passante et booster la vitesse d’un site !
Les utilisateurs vont ainsi pouvoir aller plus vite sur votre site et votre SEO n’en sera que plus performant.
Pour aller plus loin dans votre démarche, consultez notre livre blanc
