Julien Carnelos Blog – Archives

Suite à mon premier article où je montrais une implémentation simple de l’objet XmlHttpRequest sous Struts, il serait dommage de considérer cette méthode comme idéale. Il existe en effet de nombreuses bibliothèques prêtes à l’emploi qui permettent d’accélerer le développement d’interfaces riches en AJAX.

Je vais tenter ici de comparer plusieurs de ces frameworks parmi les plus connus en me limitant à ceux open-source. La finalité de cet article n’est pas d’être le N-ième article publié à décrire les avantages de AJAX mais de regarder avec une vision pragmatique comment ils s’implémentent. Attention, ce guide n’est absolument pas exhaustif et ne cite que des frameworks dont j’ai déjà entendu parler.

N’étant pas un designer très balaise, je vais passer rapidement sur les framework avec des fonctionnalités quasi-uniquement cotés client.

Parmi ceux ci, on a :

• script.aculo.us – version 1.5.3
• rico – version 1.1.1
• dojo toolkit – version 0.2.2

Scriptaculous est bien connu par ceux qui codent avec ruby on rails car ce framework est directement intégré dans rails. Son utilisation est donc transparente dans ce langage et permet d’écrire du code comme :

<%= text_field_with_auto_complete :contact, :name %>

Et hop un champ texte avec auto-complétion… Par contre, si on veut utiliser scriptaculous avec un serveur Java, il faudra coder toute la partie serveur à la main, ce qui est beaucoup moins simple.

Le suivant est Rico basé lui-même sur Prototype (même librairie de base que scriptaculous). Comparé à scriptaculous, il semble plus complet avec des animations, gestion de Behavior, etc. Je ne suis pas spécialiste du sujet, si un lecteur le sent, qu’il n’hésite pas à me préciser les différences en commentaire et je les ajouterai au texte.

Dojo est un framework « lourd » qui tente de rassembler tout ce qu’on pourrait demander à un toolkit de browser. La liste des sous-projets est à ce titre impressionnante puisque le répertoire src contient 388 fichiers et 33 dossiers.

Plusieurs packages ou « editions » sont disponibles, mais la version qui nous intéresse est le package « Ajax-Edition ».

Avantages de dojo sur les autres : Gestion du bouton Back du navigateur. Ceci est un gros problème d’utilisabilité qui concerne tous les framework et Dojo propose une solution élégante :

Chaque appel XmlHttpRequest ressemble à ça :

dojo.io.bind({    url: "http://foo.bar.com/sampleData.js",    load: function(type, evaldObj){        // hide the form when we hear back that it submitted successfully        sampleFormNode.style.display = "none";    },    formNode: sampleFormNode });

Et bien, dans le cas où on veut gérer le retour arrière par bouton, un simple paramètre supplémentaire suffit :

dojo.io.bind({    ...    backButton: function(){        // ...and then when the user hits "back", re-show the form        sampleFormNode.style.display = "";   ... });

Pas mal non ! On peut même gérer si l’utilisateur appuie sur la flèche avant (Qui sera compté comme une action différente) avec un « :forward »

C’est une intention louable de traiter le problème du back mais son implémentation implique de rajouter 2 méthodes à chaque appel pour traiter les 2 cas, ce qui peut paraître un peu lourd à l’utilisation.

Dojo gère également le bookmarking. Il suffit de rajouter un parametre à la méthode de binding qui ajoutera une ancre fantôme de la forme #xxx à la fin de l’url. Une idée excellente et simple à mettre en oeuvre !

pour les framework spécial Java, à suivre avec la deuxième partie.