Le framework JavaScript révolutionne ses méthodes asynchrones
Introduction de Idelways
L'équipe de développement de JQuery vient d'annoncer la disponibilité en version finale de la version 1.5.
Il s'agit d'une version majeure qui apporte son lot de nouveautés, qui améliore les performances et qui, par l'introduction de la nouvelle l'API Deferred, révolutionne les méthodes asynchrones du populaire framework JavaScript.
Le module Ajax a également subi une réécriture complète. Un grand nombre de lacunes du module ont été corrigées et la cohérence entre les méthodes de l'API améliorée.
Autre nouveauté notable, l'introduction de $.sub() qui crée une nouvelle copie de jQuery dont les propriétés et méthodes peuvent être modifiées sans affecter l'objet jQuery original.
Pour comprendre le fonctionnement et l'utilisation des nouveautés de cette version, lire ci-après, l'étude réalisée en collaboration entre danielhagnoul et gwinyam de la rubrique Développement Web de Développez.com.
Pour tester cette version, il suffit d'inclure un appel au jQuery Code Server dans votre page web :
Code : | Sélectionner tout |
<script charset="utf-8" src="http://code.jquery.com/jquery-1.5.min.js"></script>
@danielhagnoul : Sur une page web, seul l'utilisateur doit décider de l'enchaînement des actions, c'est pourquoi la qualité du code asynchrone d'une bibliothèque JavaScript est primordiale pour offrir au développeur un maximum de possibilités et de performances.
En provenance du vocabulaire de la programmation concurrente, nous parlerons désormais de promesses (Promises) et d'objets différés (Deferred Objets).
L'API Deferred de jQuery est basée sur le concept de promesses qui fournissent une interface générique pour la réalisation d'une action asynchrone.
Les promesses permettent :
- de traiter séparément les actions entreprises lors d'un appel asynchrone, comme on le ferait pour un appel synchrone,
- d'appeler une fonction avec les arguments voulus sans s'inquiéter de savoir s'il s'agit d'un appel synchrone ou asynchrone, car les complications générées par l'appel asynchrone sont prises en charge par la promesse.
@gwinyam : Au passage, l’équipe de développement en a profité pour améliorer sérieusement les performances sur les méthodes .children(), .prev() et .next().
Deferred
@gwinyam : jQuery.Deferred est un objet chaînable qui permet d’enregistrer de nombreuses fonctions de type callback, les appeler et transmettre l’information de réussite ou d’échec de toute fonction, qu’elle soit synchrone ou asynchrone.
Un objet Deferred est initialisé dans l’état “non-résolu”. Tout callback ajouté par .then(), .done() ou .fail() sera exécuté ultérieurement.
Appeler la fonction .resolve() ou .resolveWith() passe l’objet Deferred à l’état “résolu” et exécute immédiatement les callbacks définis.
L’appel à la fonction .reject() ou à .rejectWith() passe l’objet à l’état “rejeté” et exécute les callbacks correspondants.
Une fois entré dans un de ces deux états, il y reste.
Des fonctions de callbacks peuvent être ajoutées qui seront alors immédiatement exécutées selon si elles sont ajoutées avec .then(), .done() ou .fail().
Appeler une seconde fois les fonctions .resolve(), .resoleWith(), .reject() ou .rejectWith() n’aura aucun effet et ne provoquera donc pas une seconde exécution des fonctions callbacks liées.
Dans les nombreux cas où l’API de jQuery retourne un objet Deferred, tels que $.ajax() ou $.when, vous n’aurez à utiliser que les fonctions .then(), .done() et .fail() pour ajouter des callbacks à la file du Deferred. L’API interne de jQuery se chargera elle-même d’appeler les fonctions .resolve() et .reject(), exécutant par la même les callbacks appropriés.
L’objet Deferred dispose également de deux autres méthodes permettant le contrôle de son statut et qui renvoient un booléen : .isResolved() et .isRejected(). La première permet de savoir si l’objet est dans l’état “résolu”, la seconde dans l’état “rejeté”.
AJAX
@danielhagnoul : Le module AJAX a subi une réécriture complète, elle permet de corriger un grand nombre de lacunes qui existaient dans l'ancien système Ajax avec un niveau plus élevé de cohérence des méthodes de l'API.
Le premier changement que vous verrez dans le composant AJAX est sans doute la nouvelle signature: $.ajax ([url], [options]). Cette écriture permet de récupérer une URL avec les options par défaut plus facilement. Bien sûr, ce n'est que la pointe de l'iceberg, car $.ajax() a été réécrit entièrement pour fournir de nouvelles fonctionnalités.
$.ajax (ou $.get, $.post, etc) retourne maintenant un objet jXHR qui assure la cohérence de l'objet XMLHttpRequest sur toutes les plateformes et vous permet d'effectuer des tâches précédemment impossibles comme l'abandon de demandes JSONP.
Les objets XHR originaux sont cachés à l'utilisateur au profit d'un nouvel objet spécifiquement jQuery. Cet objet (jXHR) fournit les propriétés et les méthodes pour définir et obtenir des en-têtes, les demandes d'annulation, l'état de la transaction, les réponses au format XML et texte. Mais contrairement à l'objet XHR original, il agit également comme une "promesse" (Promises).
Une "promesse" (promises) permet d'ajouter des fonctions de rappels (callback) pour gérer le succès et l'erreur d'une transaction même après son exécution.
Ajax est maintenant beaucoup plus extensible — ce qui vous permet d'attacher toutes sortes de gestionnaires de données, de filtres et de transports.
$.ajax() dispose de trois moyens d'étendre ses fonctionnalités pour l'envoi, la réception et la gestion des requêtes AJAX:
Prefilters : Généralisé les fonctions de rappels (callback) du type beforeSend pour gérer des options personnalisées ou modifier celles qui existent déjà.
Converters : Généralisé les fonctions de rappels (callback) du type dataFilter que l'on appelle en réponse à un type de données particulier en cours de réception qui diffère de ce qui était attendu.
Transports : Nouveau dans 1.5, ils sont utilisées en interne pour émettre des requêtes par $.ajax()
Ces changements devraient conduire à la création de nouveaux plugins.
$.sub()
@danielhagnoul : $.sub() crée une nouvelle copie de jQuery dont les propriétés et méthodes peuvent être modifiées sans affecter l'objet jQuery original.
Divers
@danielhagnoul : Pour la compression du code, l'équipe a choisi d'abandonner “Google Closure Compiler” au profit de “UglifyJS”.
Cette version corrige 83 bugs et ferme 460 tickets.
Liste des navigateurs compatible avec la suite de tests, 4437 tests, de jQuery 1.5, :
- Safari 5.0.3 / 4.0.5 / 3.2.3 / 3.1.2
- Opera 11,01 / 11 / 10,63 / 10,54 / 10,10 / 9,64
- IE 6 / 7 / 8
- Firefox 4.0b9 / 3.6.13 / 3.5.11 / 3.0.19 / 2.0.0.20
- Chrome 8.0.552.215 / 8.0.552.237 / 9.0.597.67 Beta / 10.0.642.2 Dev
Feuille de route (roadmap) :
- 2011-01-31 : jQuery 1.5 : la version finale.
- 2011-02-XX : jQuery 1.5.1 : la première version de maintenance.
- 2011-04-xx : sortie de la feuille de route officielle pour jQuery 1.6
Bibliographie
- http://blog.jquery.com/
- http://api.jquery.com/category/version/1.5/
- http://en.wikipedia.org/wiki/Promise_(programming)
- http://fr.wikipedia.org/wiki/Programmation_concurrente
- http://plugins.jquery.com/project/deferred
- https://github.com/sifu/jquery-deferred
- http://jaubourg.net/?tag=deferred
- http://dojotoolkit.org/api/1.5/dojo/1.2/dojo.Deferred
- http://www.sitepen.com/blog/2010/05/...-deferred-1-5/
- http://api.jquery.com/jQuery.sub/
- http://api.jquery.com/category/deferred-object/