Il y a quelques mois j’écrivais un article sur le temps de chargement des sites, et je voulais revenir sur les moyens de le rendre plus performant. Car le temps d’attente lors du chargement des pages doit rester minime afin d’éviter de faire fuir les visiteurs. Voici quelques principes qui peuvent accélérer de façon notable le chargement des pages.
1.Hébergement des images et autres médias lourds
Lorsque que vous voulez limiter le nombre de requêtes, ainsi qu’alléger la bande passante vous pouvez mettre en ligne vos images et vos médias (vidéos, Flash…) sur un autre serveur. Vous pouvez très bien mettre en ligne directement vos images avec ImageShack ou bien Flickr qui sont des services reconnus et qui affichent très rapidement les images. Après vous pouvez disposer d’un hébergement gratuit comme celui de Google Pages ou de free dans lequel vous pouvez mettre vos fichiers à télécharger…
2.Optimiser votre code HTML et CSS
Enlever les espaces superflus, les déclarations en double peut vous faire gagner de la bande passante. Avec des outils comme CleanCSS vous pourrez directement le faire en ligne. Il existe aussi une façon d’écrire qui, à la longue, raccourcit le code CSS (ex: “margin-top: 20px; margin-right: 10px; Marge droite: 10px; margin-bottom: 20px;” peut s’écrire simplement “margin: 20px 10px 20px 10px;”).
3.Optimiser vos images
Tous les formats d’images peuvent être optimisés. Que ce soit du GIF, JPEG PNG vous avez dans la plupart des logiciels de retouche d’image un menu “Enregistrer pour le Web” qui allège votre fichier en sortie. Sous photoshop je navigue entre 40 et 60 sur 100 pour la qualité des images. Cela dépend de ce que rend l’aperçu, plus il y a couleurs moins on peut optimiser.
4.Eviter de rajouter trop de code
Une page HTML est en moyenne 8 à 10 fois plus rapide à afficher qu’une page calculée par le serveur (ASP, PHP…). Il en est de même avec le code Javascript que l’on peut insérer pour faire des effets visuels sympas. La librairie MooTools rassemble beaucoup de fonctionnalités et reste très légère. Enfin les scripts/widgets à installer pour améliorer votre site ralentissent souvent l’affichage des pages, il est conseillé de sélectionner les widgets/plugins en fonction de leur pertinence et de leur utilité pour éviter de surcharger.
5.Limiter le nombre de requête
A chaque objet (image, script, css) le serveur est solicité par un envoi de requête (une sorte d’aller-retour). Le nombre de requête peut être diminué en rassemblant les scripts javascripts en un seul et même fichier (de même pour les fichiers CSS).