Cos’è Ajax e come funziona?

Ajax è l’acronimo di Asynchronous JavaScript e XML. È una tecnica di sviluppo software utilizzata per realizzare applicazioni web interattive in grado di operare in maniera asincrona. Grazie ad Ajax è possibile far sì che gli utenti interagiscano in maniera dinamica con il sito. Vediamo insieme come funziona ed alcuni esempi pratici.

 

 

 

Come funziona

AJAX raggruppa più tecnologie e non va classificato come linguaggio di programmazione. Ajax è un set di tecnologie di sviluppo. Un sistema che include:

  • HTML/XHTML per il linguaggio principale e CSS per la formattazione.
  • DOM (Document Object Model) per la visualizzazione dinamica e l’interazione.
  • XML per l’interscambio di dati e XSLT per la loro manipolazione.
  • L’XMLHttpRequest object per le comunicazioni asincrone.
  • JavaScript per riunire tutte queste tecnologie.

Per capire come funziona il tutto occorre avere un minimo di conoscenze informatiche, ma volendo semplificare il più possibile possiamo spiegare il suo funzionamento effettuando una comparazione tra un modello convenzionale ed un modello Ajax:

 

 

Modello Convenzionale:

  1. Richiesta http inviata dal browser web al server.
  2. Il server preleva i dati.
  3. Il server invia i dati al browser.
  4. Il browser ricarica la pagina utilizzando i dati ricevuti.

L’utente non può fare altro che aspettare che il processo termini. Un modello, quindi, che comporta tempi lunghi ed un inutile carico per il server.

 

 

Modello Ajax

  1. Il browser crea una chiamata JavaScript che, a sua volta, attiva un XMLHttpRequest.
  2. In background il browser web invia una richiesta Http al server.
  3. Il server recupera i dati e li invia al browser web.
  4. Il browser, ottenuti i dati, li mostra direttamente nella sezione preposta senza la necessità di ricaricare la pagina.

 

 

Alcuni esempi pratici

L’esempio più comune è quello che riguarda Google. In fase di digitazione di una parola chiave nel campo di ricerca il sistema mostra in tempo reale dei suggerimenti. Ciò avviene senza la necessità di ricaricare la pagina ad ogni digitazione (cosa che renderebbe impossibile tale funzionalità).

Altri esempi:

  • Sistema di votazione
    Hai mai dato un voto ad un prodotto o ad un servizio acquistato online? Molto probabilmente l’operazione effettuata è avvenuta tramite Ajax. Una volta cliccato sul pulsante per esprimere il tuo voto la pagina ha mostrato un messaggio di avvenuta votazione senza la necessità di effettuare il refresh.

  • Chat
    Molti e-commerce offrono assistenza tramite chat. Se non si utilizzasse Ajax sarebbe necessario ricaricare la pagina ogni qualvolta si invia o si riceve un messaggio.

 

  

You may also like