Conférence 2016 "optimisation des performances web"

Résumé d'Alexandra Pietri étudiante de L3 SPI parcours informatique :

Le mercredi 9 novembre 2016 à 14h, en salle 121 de l'UFR Sciences et Techniques (Campus Grimaldi) à Corte, Damien Grandi ancien étudiant de l'Université de Corse ainsi que co-fondateur de DataSensia et spécialisé dans le développement web a donné une conférence sur le thème "Quand l'optimisation du développeur ne suffit plus".
 
Une étude a montré qu'en moyenne, 1 utilisateur sur 4 quitte la page web si celle-ci ne se charge pas en moins de 4 secondes. Il est donc parti de ce constat pour présenter différentes méthodes d'optimisation pour la programmation d'application web ainsi que différentes méthodes pour accélérer le chargement et l'affichage d'une page web.
 
Il a découpé sa présentation en 3 axes :

• Des outils et diverses techniques d'optimisation
• Le cache client
• Le cache serveur

 
Il existe divers outils permettant d'optimiser ses applications web tels que gulp, mimosa, brocoli ou encore grunt. Tout au long de la présentation c'est gulp qui sera utilisé.
 
Dans un premier temps, il a présenté différentes méthodes d'optimisation dans les codes sources :
 

• Le compactage du code qui se décompose en deux techniques, la minification (pour les fichiers html et css) et l'obfuscation (pour les fichiers javaScript).
• L'optimisation des images en utilisant des fichiers JPEG (qui est format plus léger) correspondant aux dimensions de celles de sortie et/ou en les compressant.
• L'utilisation de JPEG progressifs qui ont un poids plus faible que les formats classiques et qui occupe leur place dans la page web bien avant le chargement complet de celle-ci
• La réduction du nombre de requête http car plus il y a de fichiers plus il y a de requêtes et plus le temps de chargement est long.
• La concaténation des fichiers code source c'est-à-dire concaténer les css entre eux et les fichiers javaScript entre eux de façon à avoir pour chaque type de fichier qu'un seul gros fichier à télécharger qui sera plus rapide à charger que plusieurs.

 
 
Ensuite il a expliqué comment accélérer le chargement des pages d'un site grâce au cache client et serveur.
En ce qui concerne le cache client, s'il n'y a pas de ressource présente dans le cache du client alors toutes les ressources seront téléchargées.
En revanche, si elles existent déjà mais qu'elles ont expiré et que celles ci n'ont pas été changées alors le serveur sera tout de même interrogé. Il a donc expliqué l'importance de la mise en place d'un Asset Manager permettant de renommer les fichiers ayant été modifiés afin que le client identifie la ressource comme étant différente, ceci permettant d'éviter que le client interroge le serveur si un fichier n'a pas été renommé, et donc par conséquent, n'a pas été modifié.
Pour le cache serveur, utiliser la méthode précédemment décrite, cela permet une réduction de la charge du serveur et donc d'éviter de recalculer les sorties de pages dynamiques systématiques pour tous les clients. Cela permet aussi une réduction de temps de réponse puisque les ressources sont déjà prêtes.
 
Pour conclure, avant de procéder à l'optimisation il faut choisir une architecture de fichiers adéquate pour les tâches de déploiement et bien comprendre la logique client-serveur. Il faut également définir une limite de l'optimisation car il est toujours possible d'optimiser plus mais cela prends du temps à réaliser.


 

Retrouvez l'article post conférence de Damien sur le site de code4corsica

http://code4corsica.com/blog/evenementiel/conference-optimisation-des-performances-web