Que ce soit pour le confort des visiteurs ou même maintenant pour le référencement (Google privilégiera un site rapide plutôt qu’un plus lent à qualité égale), le temps d’affichage d’une page web est très important. Aussi, il existe des petites astuces que j’utilise depuis plus de deux ans et que je mets en place sur les sites de mes clients.
Tout d’abord, je prends en exemple que si votre serveur est équipé de Apache 2. Si vous ne savez pas quelle version vous avez, consultez le phpinfo de votre hébergeur ou aussi créer un fichier php (test.php) en indiquant le code suivant :
Mettez le fichier sur votre serveur et lancez le en tapant son adresse (http://monsite.com/test.php). Vous aurez alors la version Apache utilisée sur votre serveur.
Vous avez Apache 2 alors maintenant à la racine de votre site, si vous avez un fichier .htaccess, ouvrez-le. Si vous n’en avez pas créez en un. Dans ce fichier mettez le code suivant :
Avec ce code vous allez utiliser la compression Gzip. Cette option permet de compresser la taille des fichiers (html, javascript…) demandé par le navigateur et donc de réduire grandement le temps de chargement.
Sur la ligne AddOutputFilterByType, on demande la compression des fichiers html, xml, css, js.
Passons maintenant à la mise en cache, pour ce faire, rajoutez le code suivant dans votre .htaccess :
#ExpiresDefault "access plus 3600 seconds"
ExpiresByType image/gif "access plus 10 days"
ExpiresByType image/png "access plus 10 days"
ExpiresByType image/jpeg "access plus 10 days"
ExpiresByType image/jpg "access plus 10 days"
ExpiresByType application/x-javascript "access plus 10 days"
ExpiresByType application/javascript "access plus 10 days"
ExpiresByType text/css "access plus 10 days"
ExpiresByType text/javascript "access plus 10 days"
A quoi ça sert tout ça ? Cela permet de forcer le navigateur du visiteur à mettre en cache les type de fichiers que l’on a choisi. On lui indique donc combien de temps il peut conserver ces fichiers sans les redemander et donc faire une requête.
Dans mon exemple, j’ai mis un « Expires » de 10 jours sur les fichiers images (jpg, jpeg, png et gif), sur les css et les fichiers js. Vous remarquerez que dans cet exemple j’ai une ligne commentée : #ExpiresDefault « access plus 3600 seconds ». En effet, je n’active pas les expires sur le reste des fichiers. Vous pouvez le décommenter si vous le souhaitez, mais mettez une valeur pas trop grande. Là, il est indiqué 1 heure, soit 3600 secondes.
Vous pouvez changer les valeurs par celle que vous voulez.
Enregistrez votre fichier et mettez le en ligne. Vous avez maintenant une page web compressée et ses composants aussi (js, css..) et vos images sont en cache, tout comme le js et le css. Avec ces modifications, vous pouvez gagnez quelques centaines de précieuses millisecondes et pour les boutiques les plus lourdes, cela peut se calculer en secondes. Il serait bien dommage de ne pas en profiter.
[...] janvier 2012, je vous donnais quelques astuces afin d’Optimiser le temps de chargement de votre e-commerce. Si vous ne le savez pas encore, le temps d’affichage d’une page d’un site est [...]