La meilleure façon d’optimiser les demandes faites à partir de votre page est évidemment de ne pas en faire. Et l’un des moyens les plus utiles pour éviter des demandes non nécessaires est d’utiliser ce qu’il y a déjà dans le cache du navigateur. Par défaut, c’est le navigateur qui décide pendant combien de temps il doit mettre en cache des fichiers. Mais nous pouvons contrôler le moment exact où le dossier sera conservé dans le cache.
Ce type de configuration est à effectuer sur le serveur (et dépendra de quel configuration de serveur vous disposez). Avec Apache, par exemple, vous pouvez ajouter la configuration suivante dans un fichier .htaccess :
ExpiresActive On
ExpiresByType image/gif "access plus 6 months"
ExpiresByType image/jpeg "access plus 6 months"
ExpiresByType image/png "access plus 6 months"
ExpiresByType text/css "access plus 6 months"
ExpiresByType text/javascript "access plus 6 months"
ExpiresByType application/javascript "access plus 6 months"
Ces instructions demandent un cache d’images, de CSS et de JS pour 6 mois. Il est générallement recommandé de les mettre en cache pendant au moins un mois. D’autres serveurs peuvent être configurés de manière similaire.
Une chose importante à retenir est qu’une fois mis en cache, le navigateur ne va pas demander de nouveau fichier. Si nous avons besoin de modifier le contenu du fichier, il ne fonctionnera pas dans la façon dont nous pourrions nous y attendre. Pour envoyer une nouvelle version, nous aurons besoin de changer le nom du fichier. Une façon de faire est d’ajouter une certaine forme de versions ou d’un horodatage au nom du fichier. Par exemple, au lieu de home.js vous pouvez utiliser home-v1.js et quand vous avez besoin de mettre à jour le fichier, changer le nom par la home-v2.js , etc.
Une autre forme courante pour supprimer le cache est d’utiliser un paramètre GET dans l’URL: home.js?v=1 et home.js?v=2 . Cette méthode présente l’inconvénient que certains proxys sur internet ignorent les paramètres GET, mais respectent les règles de cache, ce qui vous rend incapable de briser le cache sur ces fichiers quand vous le souhaitez.
Gzip
Un grand pourcentage de contenu d’un site est un texte simple (HTML, CSS, JavaScript, JSON, XML, etc.) Pour ce type de contenu, c’est une bonne pratique d’activer la compression GZIP au niveau du serveur.
GZIP compresse les données sur le serveur avant de l’envoyer sur le réseau vers le navigateur de l’utilisateur. Le navigateur décode alors à la volée pour l’utilisateur. C’est comme de compresser un fichier avant de l’envoyer à quelqu’un pour le rendre plus petit. Tous les navigateurs modernes et les serveurs actuels prennent en charge GZIP.
La configuration se fait sur le serveur. Sur Apache, par exemple, vous pouvez modifier le fichier .htaccess et activez GZIP pour les types de fichiers que vous souhaitez:
C’est tout aussi simple à mettre en place sur les autres serveurs populaires (consultez votre documentation!) Et c’est l’un des conseils les plus efficaces pour améliorer la performance.
Les outils de diagnostic: vos meilleurs amis
Si vous souhaitez vous aventurer dans ce monde de performance web, il est essentiel d’installer les extensions YSlow et PageSpeed dans votre navigateur. A partir de maintenant, ce seront eux vos meilleurs amis.
En général, chaque outil analysera les performances de votre site et créera un rapport qui donnera à votre site un grade couplé à de précieux conseils pour vous aider à résoudre les potentiels problèmes.
C’est tout pour aujourd’hui !
Nous espérons que, après avoir lu ce guide, vous allez obtenir un site en meilleur forme. 🙂
L’optimisation des performances de votre application est une entreprise rentable, mais ne devrait pas être la seule base de choix sur l’ensemble de votre développement. Il vous faudra prendre des décisions à certains moments et peser les coûts et les avantages de celles-ci.
Vous voulez en savoir plus? Vérifiez les références que nous avons utilisées pour rédiger ce guide.
N’oubliez pas de partager avec vos amis ces conseils. Ensemble nous fairons un web plus rapide pour tout le monde. O /
1 réflexion au sujet de « Optimisation de code – comment faire perdre du poids aux pages – le serveur – 5/5 »