Les cadres d'applications Ajax

La meilleure technique pour construire des pages web dynamiques est Ajax . Le code JavaScript imbriqué dans la page est utilisé pour envoyer des requêtes au serveur et pour modifier la page. Du coté serveur, des traitements sont nécessaires pour répondre aux requêtes: trouver les informations, ou enregistrer des données. Pour cela on a besoin d'un cadre d'application spécialisé. Il se compose toujours de fonctions JavaScript, et éventuellement d'une bibliothèque coté serveur. Il en existe dans de nombreux langages de programmation et sous différents environnement, mais seuls les principaux sont pris en compte ici.

Pourquoi un framework?

Le framework est en fait le moteur dont parle l'article de J. J. Garrett, qui supprime l'attente du lecteur envers le serveur.
Il fournit les fonctions classiques JavaScript pour utiliser l'objet XMLHttpRequest, pour tous les navigateurs, et toutes les fonctions d'interaction avec le serveur.
En fait, certains frameworks peuvent aller plus loin et permettre de créer ce que l'on appelle des "applications clients riches", des applications fonctionnant à distance, sur un navigateur, dotée d'une interface graphique et des mêmes fonctionnalités qu'une application locale.

Fonctionnalités d'un framework Ajax

Tous les frameworks sont capables de communiquer avec le serveur, donc de lire des fichiers, d'envoyer des données ou de passer des commandes à exécuter sur le serveur, ce qui suppose l'emploi d'un script coté serveur.
Les frameworks proposent souvent des composants qui tirent parti de la communication asynchrone avec le serveur.
Les exemples classiques sont les bouton, panels à ongles, grilles, listes déroulantes et autres widgets.
Un exemple plus innovateurs, les "box" tendent à se répandre, avec comme exemples Lightbox et Slimbox. Ce sont des galeries d'images qui les placent côte à côte à l'écran et utilisent Ajax pour un affichage instantané.

Les frameworks peuvent être commandés du coté du serveur et dans ce cas, les composants sont créés sur le serveur avec un langage de scripts comme PHP et envoyés au navigateur. Ajax sert à transmettre les actions de l'utilisateur et prendre en charge les résultats.

La capacité de fonctionner hors-ligne, comme cela est permis par HTML 5 complète le framework aussi bien.

Quel framework Ajax choisir?

Si l'on veut utiliser un framework Ajax pour faire des pages dynamiques sans avoir a réécrire soi-même toutes les fonctions Ajax et les tester sur tous les navigateurs reste à choisir quel framework!
Ils sont si nombreux que l'on se demande lequel utiliser. Si l'on se trompe dans mon choix on sera obligé plus tard de refaire ses pages avec un framework différent!

On a moins de chance de regretter le choix d'un framework si l'on adopte un des plus utilisés car ils sont continuellement complétés de nouvelles extensions et disposent d'un support important par les utilisateurs.
Parmi ceux-ci, on peut distinguer jQuery, bien documenté, Mootools qui est modulaire, Ext JS qui offre de nombreux widgets de RIA.
L'interaction avec un langage coté serveur guidera aussi le choix.

Bibliothèques JavaScript

Un grand nombre de frameworks sont constitués en fait uniquement de fonctions JavaScript, et laisse la partie serveur au soin du programmeur.
La plupart d'entre eux utilisent XML comme format de données, et quelquefois JSON, un autre format textuel.

Mais tous ces frameworks JavaScript simples datent un peu, il est plus courant maintenant d'utiliser React, Angular ou Vue.js qui tous permettent un accès à une base de données.

• jQuery.
  Librairie JavaScript qui supporte Ajax et permet un accès complet au DOM. JQuery est intégré aux CMS Wordpress et Drupal.
  Il offre une documentation complète.
  jQuip est une version plus modulaire de JQuery avec seulement 4k pour le code de base.
• Closure.
  Le framework JavaScript de Google est accompagné d'un compilateur et d'un système de templates pour générer les pages. Présentation (anglais).
• Prototype.
  C'est la base de nombreuses autres librairies, dont celle de Yahoo. La librairie semble se donner pour but de réduire la taille du code Ajax.
• Script Aculous.
  Un des premiers frameworks, Script Aculous a très tôt développé de nombreux effets graphiques et dynamiques pour agrémenter les pages Web.
  Les bibliothèques concurrentes plus récentes sont mieux optimisées.
• Mootools.
  Alternative à JQuery, propose des effets graphiques.
  Mootools dispose de fonctionnalités similaires à celle de jQuery. Il est modulaire. De nombreuses extensions fournissent des widgets graphiques tels que Lightbox, galeries d'images...
• ExtJS.
  Plateforme JavaScript de développement d'applications Web conformes aux standards. Fournit un ensemble de composants graphiques.
  Dédié aux applications Web riches, les RIAs, Ext JS dispose de nombreux plugins et composants d'interface utilisateurs, les widgets.
  En outre il peut sans difficulté être combiné avec un autre framework (il faut que ce soit réciproque) ou des bibliothèques JavaScript.
  Il est modulaire.
  
• Dojo Toolkit.
  Propose des packages et un mécanisme qui les charges en bloc avec la page. Il peut créer des composants (graphiques ou non) réutilisables dont un ensemble est fourni sur le site. Il permet de manipuler le DOM plus facilement, de faire des animations.
• Qooxdoo.
  Permet de créer des interfaces utilisateur en JavaScript similaires à celle d'un logiciel local. Un ensemble de composants graphiques étant fournis avec les fonctions pour les gérer au clavier ou à la souris. Du code coté serveur en PHP ou Java est fourni par des tiers pour l'interaction par XMLHttpRequest.
• Anaa.
  Une librairie simple pour un GET ou POST avec callback. Implémente responseHTML, dispose de l'extension A.E.P.
  Anaa est un framework minimal, il permet les opérations de lecture et écriture, et peut se combiner avec toute bibliothèque JavaScript. Il convient pour apprendre Ajax et pour l'ajout occasionnel de fonctionnalités asynchrones.
  

Frameworks Java

Java est le langage le plus utilisé par les entreprises qui proposent des services web. L'utilisation d'un framework permet alors d'ajouter aux services les avantages que procure Ajax: modification instantanée de la page et utilisation de fichiers XML pour échanger de l'information.

• Google Web Toolkit est une boite à outils pour développer des applications en Java, lesquelles seront compilées en code JavaScript, qui opère sur la page HTML en utilisant le DOM.

Frameworks .NET

• Microsoft Ajax Library (anciennement ATLAS), se compose d'une partie coté client: Microsoft Ajax Library, et d'une partie coté serveur: ASP.NET 2.0 Ajax Extensions, à quoi s'ajoute une librairie de composants, notamment graphiques: ASP.NET Ajax Control Toolkit.

Au-delà d'Ajax

Certains développements en cours vont renforcer l'importance d'Ajax sur le Web en fournissant des standards pour les applications Web riches, principalement HTML 5, qui ajoute des fonctionnalités d'applications à HTML et qui permet de faire fonctionner les applications Web hors connexion.

• Voir les bibliothèques JavaScript pour réaliser des applications Web.
• WebSocket. Un accès bidirectionnel au serveur.

Plus d'informations

• Le tutoriel Ajax. Apprendre Ajax et XMLHttpRequest avec des exemples.
• JSON. Une description de ce format de données alternatif à XML.
• Ajax API library. Google centralise le chargement d'un framework aux choix parmi les plus populaire et s'engage à tenir indéfiniment à disposition en ligne.
  Cela semble devoir ralentir le chargement de faire appel à un site extérieur, mais si le code JavaScript est mis en cache, comme c'est normalement le cas, cela pourrait au contraire l'accélérer.

Event.observe(window,'load',function()
{
    Event.observe($('container'), 'DOMNodeInserted', init);
}.bindAsEventListener());
 
var init = function()
{
    Event.observe($('buttAlert'), 'click', function()
    {
        alert('alert !!');
    }.bindAsEventListener());
}