AJAX, histoire et présentation
La première formalisation du terme AJAX en tant que tel date de 2005 mais les techniques utilisées ont commencé à être mises en place dès la fin des années 1990. A cette époque, la plupart des sites Web étaient entièrement conçus à base de HTML et la moindre action de l’utilisateur (envoi ou demande de données) résultait par le chargement d’une nouvelle page envoyée par le serveur. Ce processus était inefficace, lent, et peu agréable pour l’utilisateur.
C’est à cette époque où les développeurs ont commencé à développer le chargement de données asynchrone qui a débouché sur l’objet XMLHttpRequest et sur l’AJAX qui l’utilise largement.
L’AJAX permet d’ envoyer et récupérer des données d’un serveur de manière asynchrone (en arrière-plan) sans interférer avec l’affichage et le comportement de la page existante. Grosso-modo, l’AJAX nous permet de modifier de manière dynamique le contenu d’une page, c’est-à-dire sans qu’il soit nécessaire de recharger l’intégralité de la page.
A sa création, l’AJAX utilisait les technologies suivantes qui lui ont donné son nom :
- Le XML pour l’échange de données avec le serveur ;
- L’objet
XMLHttpRequestpour la communication asynchrone ; - Le JavaScript pour afficher les données de manière dynamique et permettre à l’utilisateur d’interagir avec les nouvelles informations ;
- Le HTML et le CSS pour la présentation des données.
Aujourd’hui, le XML a été largement délaissé au profit du JSON (JavaScript Object Notation) qui est une notation qui permet d’échanger des données relativement simplement tandis que l’objet XMLHttpRequest est lentement en train de laisser sa place à la nouvelle API Fetch.
“L’AJAX” ou plutôt “l’Ajax” est aujourd’hui un terme générique utilisé pour désigner toute technique côté client (côté navigateur) permettant d’envoyer et de récupérer des données depuis un serveur et de mettre à jour dynamiquement le DOM sans nécessiter l’actualisation complète de la page.
L’objet XMLHttpRequest et l’API Fetch
L’objet XMLHttpRequest a longtemps été, et est toujours dans une certaine mesure, au coeur de l’AJAX. C’est cet objet qui permet le dialogue asynchrone (c’est-à-dire l’échange de données en arrière plan) avec le serveur.
Pour être tout à fait précis, l’objet XMLHttpRequest est un objet navigateur prédéfini (un objet disponible dans tous les navigateurs par défaut) qui nous permet d’effectuer des requêtes HTTP en utilisant du JavaScript.
L’objet XMLHttpRequest appartient à l’interface XMLHttpRequestEventTarget qui implémente elle même l’interface DOM EventTarget.
Cet objet est cependant aujourd’hui délaissé au profit de l’API et de la méthode fetch() par la plupart des applications modernes car cette dernière est jugée plus puissante et plus intuitive à utiliser.
La méthode fetch() utilise en effet les dernières technologies JavaScript et notamment les promesses. Cependant, il reste encore des choses que XMLHttpRequest peut faire et que fetch() ne peut pas faire.
Comme les deux restent utilisés aujourd’hui, nous les présenterons et étudierons de manière équitable, en commençant avec XMLHttpRequest et en finissant avec l’API Fetch.
