AJAX, cos'è e perché si utilizza?

AJAX, cos'è e perché si utilizza?

AJAX (Asynchronous JavaScript and XML) è una tecnologia che permette alle pagine web di inviare e recuperare dati dal server in modo asincrono (in background) senza interferire con la pagina corrente.

La filosofia dietro AJAX è quella di fare più elaborazione possibile sul lato client (in JavaScript) ed inviare i dati risultanti al server solo quando l'utente li richiede.

Questo rende la pagina web più reattiva perché l'interfaccia utente non deve aspettare il risultato del processo di recupero dei dati.

Ajax usa XHTML per il contenuto, CSS per la presentazione, insieme al DOM e JavaScript per la visualizzazione dinamica del contenuto.

Le applicazioni web convenzionali trasmettono informazioni da e verso il server usando richieste sincrone. Ciò significa che si compila un modulo, si preme invio e si viene indirizzati ad una nuova pagina con nuove informazioni dal server. Con AJAX, quando si preme submit, JavaScript fa una richiesta al server, interpreta i risultati e aggiorna la schermata corrente. Nel senso più puro, l'utente non saprà mai che qualcosa è stato trasmesso al server.

XML è comunemente usato come formato per ricevere i dati del server, anche se può essere usato qualsiasi formato, incluso il testo semplice.

AJAX è una tecnologia del browser web indipendente dal software del server web. Un utente può continuare a usare l'applicazione mentre il programma client richiede informazioni dal server in background.

AJAX è la tecnologia Rich Internet Application (RIA) più fattibile finora. Sta ottenendo un enorme successo nel settore e diversi strumenti e strutture stanno emergendo. Ma allo stesso tempo, AJAX ha un'incompatibilità di browser ed è supportato da JavaScript, che è difficile da mantenere e debuggare.

Tecnologie AJAX

AJAX non è indipendente. Viene usato in combinazione con altre tecnologie per creare pagine web interattive.

  • CSS: permette una chiara separazione dello stile di presentazione dal contenuto e può essere modificato da JavaScript.
  • DOM: API per accedere e manipolare documenti, rappresenta la struttura dei documenti XML e HTML.
  • JavaScript: Linguaggio di scripting largamente utilizzato e collante per le operazioni AJAX. La funzione JavaScript viene chiamata quando si verifica un evento in una pagina.
  • XMLHttpRequest: oggetto JavaScript che esegue l'interazione asincrona con il server.

AJAX: i passi del funzionamento

  • Si verifica un AJAX.
  • Viene creato un oggetto XMLHttpRequest.
  • L'oggetto XMLHttpRequest è configurato.
  • L'oggetto XMLHttpRequest fa una richiesta asincrona al server web.
  • Il webserver restituisce il risultato contenente il documento XML.
  • L'oggetto XMLHttpRequest chiama la funzione callback ed elabora il risultato.
  • Il DOM HTML viene aggiornato.