Optimisation GWT 1.4
Par batmat le samedi 2 février 2008, 20:47 - Technique - Lien permanent
Wouah, je viens de regarder l'interview de Bruce Johnson par InfoQ à propos de GWT.
Bruce explique les nombreuses optimisations qu'ils effectuent au niveau du compilateur GWT. Il explique notamment qu'ils (les développeurs GWT) cherchent sans cesse à optimiser le compilateur, pour cela il comparent par exemple les requêtes qu'une webapp classique effectue vers le serveur et les requêtes que GWT fait.
Et en exemple, autour de la dixième minute, il explique l'optimisation concernant les images : l'ImageBundle. Dans une application classique, il y a des dizaines d'images, souvent toutes petites (icônes, fonds...). Le problème, c'est que le navigateur, même pour se voir répondre que l'image est à jour ouvre très souvent des connexions, d'autant plus qu'il y a d'image ! Ça peut créer (dixit Bruce) une contention en raison du grand nombre de sockets ouvertes côté serveur.
Et bien si vous utilisez cet objet ImageBundle, GWT construit côté serveur une image composite. Comme ça, le navigateur n'a qu'une seule image à télécharger puis vérifier, et les morceaux sont déconstruits côté client en récupérant les bouts de la grosse image et en les plaçant au bon endroit (cf. 10m40s). C'est quand même génial comme idée.
Bon après, il faut que la machine sur laquelle le navigateur tourne dépote d'autant plus, mais on n'a rien sans rien.
PS : Ce que je viens de dire n'est que le reflet de ce que j'ai compris de l'interview. Je n'ai pas testé cette fonctionnalité.
Commentaires
J'avais pensé à un système de ce genre en faisant mumuse avec les css pour afficher qu'une partie de l'image composite pour chaque élément en notant qu'effectivement il y a plein de requêtes qui partent "pour rien". Mais le fait que GWT fasse tout ce travail fastidieux à notre place, c'est quand même pas mal du tout!
A quand un GWT 100% compatible PHP? :'( ... ou plus d'hébergeurs Java !
Je n'ai pas regardé la vidéo, mais voici ce que je sais du sujet.
En fait, un navigateur n'est censé ouvrir que deux connexions simultanées sur le serveur, c'est la recommandation pour HTTP. D'ailleurs, un serveur comme Apache possède des protections pour éviter de dépasser trop de connexions simultanée.
Le problème est donc surtout côté client, puisque le navigateur ne peut récupérer que deux ressources en même temps (par serveur HTTP). Cette restriction est souvent le problème principal des pages d'accueil puisque ces pages profitent finalement rarement de la mise en cache des scripts, feuilles de style et images. Plusieurs techniques ont donc été développées parmi les développeurs web pour améliorer le chargement de leurs applications :
- la technique de "CSS sprite", elle part du même principe que ce que tu annonces dans ton billet, si ce n'est que ce n'est pas automatique. Le graphiste regroupe toutes ses images en une seule et les différentes parties de l'images sont choisies en CSS en utilisant la propriété background-position.
- la technique CDN ou Content Delivery Network, qui consiste à placer les ressources statiques sur un ou plusieurs autres serveurs que le serveur applicatif. Ainsi, on outrepasse la limitation du navigateur de n'effectuer que deux connexions par serveur en lui proposant de télécharger depuis plusieurs serveurs différents.
Yahoo possède pas mal de ressources sur l'optimisation des applications web en général, les solutions que j'ai présenté sont d'ailleurs toutes les deux utilisées dans la page d'acceuil de Yahoo. L'installation de l'outil YSlow, extension addon de l'extension Firebug pour Firefox permet d'obtenir des informations très intéressantes sur ces techniques.
Bonne optimisation