AJAX : Asynchronous JavaScript And XML

#ajax#javascript#xml

Ajax (Asynchronous JavaScript And XML) est un acronyme qui a été introduit par Jesse James Garrett, le 18 février 2005. Comme son nom l’indique, il s’appuie sur le langage JavaScript et le format XML. Ce n’est pas réellement une nouvelle technologie mais une méthodologie de conception des applications web. Cette dernière se base sur des technologies existantes et couramment utilisées (Javascript, HTML/XHTML, DOM, XML, XMLHttpRequest).

L’idée est d’échanger les données de manière asynchrone entre client et serveur via l’objet XMLHttpRequest (implémenté dans tous les navigateurs récents). Les données échangées sont stockées dans des fichiers au format XML (dans certains cas, ce format est remplacé par un autre comme JSON). Les échanges sont contrôlés avec du JavaScript, qui va ensuite agir sur la couche de présentation web (XHTML, CSS) par l’intermédiaire du DOM.

Les applications Ajax peuvent envoyer des requêtes au serveur pour ne récupérer que les informations nécessaires. Cela évite de recharger toute la page à chaque interaction client/serveur comme c’est le cas pour les applications web classique. Ainsi, Ajax permet de diminuer les échanges client/serveur et d’assurer une meilleure réactivité de l’application cliente.

Exemple de fonctionnalité Ajax : auto-complétion (suggestion de mots dynamiques) de Google sur http://www.google.com/webhp?complete=1&hl=en

Exemple Google

De plus, il est possible de réaliser de nombreux traitements coté client ce qui allège le serveur, offrant un intermédiaire entre le client léger HTML et le client riche. Etant donné qu’Ajax utilise des technologies existantes et répandues sur une large majorité de navigateurs et plateformes de développement web, son utilisation ne nécessite pas d’installation particulière. De plus, de nombreux framewoks font leur apparition ou sont en cours de développement. Ils ont pour but de simplifier l’utilisation d’Ajax et d’assurer une meilleure portabilité (En effet, le langage de script client, basé sur ECMAScript, et abusivement appelé JavaScript, varie légèrement d’un navigateur à l’autre). Pour cela, ils proposent des bibliothèques de fonctions de plus haut niveau, voire encapsulent totalement le JavaScript avec un autre langage mieux maîtrisé par les développeurs (le développement et la maintenance du JavaScript sont mal maîtrisés). Il faut noter que ces frameworks offrent souvent de nouvelles fonctionnalités graphiques qui permettent d’améliorer l’ergonomie des applications.

Fonctionnement Ajax

Avantages, inconvénients ?

Les avantages :

  1. Une meilleure réactivité des applications clientes
  2. Nouvelles possibilités offertes par de nombreux Frameworks
  3. Pas d’installation nécessaire sur le poste client
  4. Compatibilité avec les navigateurs du marché
  5. Possibilité de traiter les actions de l’utilisateur en parallèle (mode asynchrone)

Les inconvénients :

  1. Le JavaScript n’est pas adapté à des développements lourds et complexes (instabilité du code, difficultés de maintenance). Ces problèmes peuvent être résolus par l’utilisation des frameworks qui encapsulent le JavaScript.
  2. Il y a possibilité de désactiver le JavaScript sur les navigateurs, il faut donc prévoir une solution.
  3. Les robots de référencement de site n’indexent pas le contenu généré dynamiquement
  4. Au premier chargement, le poste client récupère les fichiers JavaScript qui peuvent être volumineux.
  5. La pérennité des frameworks et des solutions propriétaires actuels reste inconnue
  6. Sécurité : coté serveur, Ajax autorise des échanges asynchrones et sans confirmation
  7. Ajax peut entraîner des conflits avec certaines fonctions du navigateur (signets, boutons suivant/précédent)

Aperçu des frameworks Ajax

Frameworks bas niveau

Ces framewoks regroupent un ensemble de méthodes de bas niveau pour le développement Ajax avec javascript et CSS.

  • prototype.js : Un des frameworks les plus utilisés (directement ou indirectement). En effet, celui-ci est intégré à de nombreux autres frameworks de plus haut niveau comme Rico, script.aculo.us ou Prado.
  • jQuery : Beaucoup moins utilisé, il présente l’avantage de pouvoir être combiné avec l’utilisation du framework pQuery pour intégrer l’utilisation d’Ajax aux scripts Php.
Frameworks haut niveau

Ces frameworks regroupent plus de fonctions. Bien souvent, ils se basent sur un ou plusieurs frameworks de bas niveau. Ils proposent généralement des composants graphiques, et se présentent sous forme de fichiers JavaScript (.js) pouvant être hiérarchisés ou non.

  • Yahoo! UIL : Yahoo a rendu disponible son framework en même temps qua sa bibliothèque de design pattern.
  • Rialto : Il est uniquement compatible FireFox et IE version 6 et 7. Il contient de nombreux composants graphiques mais s’avère lourd à utiliser. En effet, le code JavaScript à charger par le client pèse 500Ko avant de pouvoir afficher les pages concernées.
  • Script.aculo.us : Permet de gérer l’interface client dont les fameux “drag and drop” spécifiques au Web 2.0. (Démo)
Frameworks « intégrés » et IDE

Ils ont pour objectif de simplifier le développement d’applications Ajax en masquant sa complexité. Le code JavaScript est généré avec un autre langage (Java pour les applications J2EE) ce qui permet de faire de l’Ajax sans développement JavaScript, offrant ainsi plus de simplicité pour le développeur. Ces frameworks font souvent appel à des IDE (Integrated Development Environment) et peuvent inclure des outils de création de GUI (Graphical User Interface) pour les applications Ajax. Ils permettent donc de développer rapidement des applications Ajax.

Quelques frameworks « intégrés » Ajax à ce jour :

  • Google Web Toolkit
  • Echo2
  • Microsoft Atlas (rebaptisé récemment AJAX Extensions)
  • AJAX Toolkit Framework : Résultat de l’initiative OpenAjax, il regroupe plusieurs frameworks (Zimbra, Rico, Dojo) et s’intègre à l’IDE Eclipse.
  • Morfik WebOS AppsBuilder : IDE complet pour des applications AJAX. Il inclut un éditeur graphique WISYWYG , et supporte les langages Pascal, Basic, Java et C#. Il est considéré comme le premier IDE destiné à concevoir des applications Web Ajax.

Conclusion

Ajax est une solution encore jeune qui doit son succès mais également ses principaux inconvénients à l’utilisation du JavaScript. Elle offre de nouvelles possibilités pour les applications web via de nombreux frameworks, et s’oriente vers le client riche. L’arrivée de nouveaux frameworks plus complets et intégrés à des environnements de développement comme AJAX Toolkit Framework (mars 2007) promet un bel avenir à cette solution, au moins à court terme. Cependant, il est difficile de savoir aujourd’hui si Ajax sera pérenne ou non, la solution pouvant être supplantée par une autre méthodologie basée sur d’autres technologies. Toujours est-il qu’à ce jour, et ce malgré ses lacunes, l’intérêt et les apports d’Ajax restent indéniables.