Voici donc ce qui pourrait faire office de mémo, ou de checklist lorsque l’on souhaite améliorer les performances de son application web. La liste des optimisations fournies ici est loin d’être exhaustive mais chaque point a l’avantage d’être facile à réaliser.
Première chose à réaliser facilement et qui ne coûte presque rien à faire est de mettre en place la compression entre le serveur (Apache dans cet exemple) et le client. Pour ce faire, rien de plus simple, il suffit d’activer le module deflate d’apache ou gzip et de rajouter les instructions suivantes dans votre virtualhost. Pour info, avec cette technique, vous pouvez diviser la taille de transfert réseau par 2!
etOutputFilter DEFLATE
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
Ces instructions demandent à APACHE de compresser tous les flux avec les types suivant, text/plain, text/html….
Le nombre d’appel serveur est primordiale dans le temps de calcul d’une page. En effet, chaque navigateur n’effectue que quelques appels simultanés vers votre serveur. Si vous avez beaucoup d’appel, le temps d’affichage de la page peut être sensiblement ralenti. On pense souvent que séparer les css ou les js en petits fichiers est une bonne idée, en particulier pour une question de maintenance et c’est vrai. Mais d’un point de vu performance, ceci est une catastrophe, il est beaucoup performant de limiter les appels serveurs à moins de 5/6 par page et ceci est pas forcément facile à réaliser.
La technique la plus simple est de regrouper tous les CSSFeuilles de style qui permettent de mettre en forme des pages web. dans un seul fichier CSS et tous les JS dans un seul fichiers JS. Ce qui fait déjà 2 appels, si on rajoute l’appel à la page elle même, ceci fait donc déjà trois appels au serveur. Il reste encore le cas délicat des images. Que faire avec les dizaines de belles images qui sont sur votre page? Regrouper les dans une seul image sprite et utiliser le CSS pour l’affichage! Le seul défaut de cette technique est que les images ne sont plus référencées aussi bien. Il est donc recommandé de ne regrouper dans les sprites que les petites images sans plus value de référencement telque les icônes.
Pour réduire la taille des JS et des CSS, il est souvent intéressant de les compresser, pour cela, il existe une multitude de petit script, tous plus ou moins efficace. Néanmois le gain est non négligeable!
Optimisation WEB: Partie 1 – Page Speed (vitesse de la page) pour les images
Optimisation WEB: Partie 1 – Page Speed (vitesse de la page) pour les images
Si vous utiliser des serveurs JEEJava Entreprise Edition. Pensez à les redémarrer une fois par nuit pour éviter que la mémoire s’accumule et que votre serveur soit lent.
Voilà donc quelques points quickwins à réaliser pour accélérer sans effort votre application WEB.