Il cosiddetto "web 2.0" ormai è una vera moda e un sacco di siti e software si vantano di essere "fatti in ajax" , "supportare ajax" , e via dicendo, ma pochissimi spiegano davvero cosa sia e cosa stia dietro a questo nuovo acronimo che a molti ricorda solo il nome di un vecchio detersivo.

Cominciamo col dire cosa NON è ajax, in quanto l'errore più comune è proprio quello di pensare che ajax sia un nuovo e rivoluzionario linguaggio di programmazione che fa miracoli per le pagine web.

Niente di più sbagliato, ajax infatti NON è un linguaggio di programmazione e addirittura non introduce nessuna novità in questo campo.

A.J.A.X. è un acronimo che significa Asynchronous Javascript And Xml e di fatto è una TECNICA di programmazione che sfrutta elementi totalmente preesistenti come javascript, css e xml unitamente ad un linguaggio server-side come ad esempio jsp o php.

La novità quindi sta nell'utilizzo di tutti questi elementi in maniera strutturata per realizzare un insieme di pagine web e relativi moduli in maniera totalmente innovativa.

Passiamo ad un altro "non": ajax non fa miracoli, non crea applicazioni o pagine super veloci, o meglio non crea niente che non si potesse già realizzare prima con un po di programmazione ben organizzata e qualche ottimizzazione, quindi non aspettatevi che basti scrivere un po di codice ajax-style per ottenere risultati sorprendenti, il trucco sta come sempre nell'organizzare saggiamente ogni elemento del programma.

Quindi qual'è' il punto di forza di ajax che lo glorifica come la nuova frontiera del web?!

E' semplice, Ajax permette di realizzare applicazioni web che si avvicinano in maniera impressionate a veri e propri programmi installati sulla vostra macchina come un client di posta o un word processo tipo Word, con un'interfaccia utente altrettanto intuitiva e potente.

Per spiegare al meglio di cosa si tratti utilizziamo un esempio: pensate ad un forum o ad un blog (altra grande moda del momento ). Vi collegate, scrivete un messaggio e lo visualizzate in attesa di una risposta dagli altri partecipanti. Tuttavia per poter visualizzare l'eventuale risposta dovrete ricaricare la pagina più e più volte fino a quando qualcuno non scriverà a sua volta e voi vedrete il nuovo post. Questo è un semplicissimo esempio di comportamento SINCRONO, voi fate la richiesta al server per ottenere la pagina e il server vi manda i dati, dal momento della richiesta alla visualizzazione della pagina non sono possibili altre azioni (ovviamente azioni che non interrompano tale procedura)

Nel caso ASINCRONO invece, tra la vostra richiesta e la risposta il server resta in ascolto per altre possibili richieste, ed è pronto ad assolverle anche mentre la prima è in esecuzione.

Se ci pensate bene è quello che accade normalmente mentre utilizzate il PC, iniziate a scaricare la posta, e mentre i messaggi scendono potete tranquillamente visitare il vostro sito preferito o ascoltare un po di musica senza interrompere per questo il download dei messaggi.

Questa è la vera novità, molti siti hanno creato interfacce grafiche per vari programmi online, basta pensare alle migliaia di client di posta che permettono di leggere la nostra casella online. Ma la differenza sta nel fatto che anzichè ricaricare l'intera pagina web per cambiare l'aspetto dell'interfaccia (metodo sincrono) e visualizzare ad esempio il testo di una mail con ajax viene inviata una richiesta in background che non blocca il resto dell'interfaccia (metodo asincrono), in modo tale che l'utente può effettuare altre operazioni. Quando la richiesta sarà terminata il client invierà solo i dati relativi ad essa (il testo del messaggio) e un meccanismo lato client aggiornerà solo la parte della pagina che la riguarda ( ad esempio sostituendo il corpo della mail precedente con la nuova mail aperta.

Ma come avviene tale sostituzione? Ecco che entrano in gioco le altre lettere dell'acronimo: Javascript e XML. Javascript permette infatti di manipolare in contenuto della pagina caricata in maniera dinamica e senza bisogno di alcun intervento da parte del server. Questo avviene tramite le cosiddette funzioni DOM tipiche dell'XML. Di fatto una pagina html (se correttamente realizzata) si può assimilare ad un documento Xml dove ciascun elemento è contenuto all'interno di tag. Ciascun tag può quindi avere un attributo "id" che lo identifica univocamente all'interno della pagina e una seria di altri attributi (ad esempio larghezza, lunghezza, colore di sfondo ecc...) che ne stabiliscono la rappresentazione all'interno del browser. Tramite DOM è quindi possibile manipolare tutti questi elementi, utilizzando l'id come riferimento e utilizzando funzioni standard per modificare attributi e contenuto.

Tornando all'esempio del testo della nostra mail, potremmo mettere l'intera mail all'interno di un semplice tag DIV con un id univoco (ad esempio id="corpomail" ). La nostra richiesta in background restituirà il testo della nuova mail e tramite DOM agganceremo il "corpomail" e sostituiremo il suo contenuto con quello nuovo.

Ovviamente le cose non sono cosi semplici come può sembrare,anche solo nel nostro esempio. basti pensare a quante cosa cambiano quando leggiamo una mail nuova. Non basta cambiare il corpo del messaggio, ci sono il titolo, i mittente, gli altri destinatari in copia. Insomma un sacco di elementi di cui tener conto tutti insieme.

In questo ci viene in aiuto l'ultima lettera, l'XML. Infatti se la nostra richiesta restituisse, anziché il solo testo della mail, un documento XML contente tutti gli elementi che ci servono, ciascuno con un suo tag identificativo le cose si andrebbero semplificando, Infatti il javascript-DOM ci permetterebbe di operare direttamente anche su questi elementi, "scorporando" la risposta nei vari elementi di interesse e permettendoci di eseguire tutte le sostituzioni di cui abbiamo bisogno all'interno della pagina.

Questa combinazioni di elementi permette quindi di realizzare interfacce grafiche molto piu elaborate, di manipolare l'aspetto della pagina in maniera piu intelligente, e (in alcuni casi) di velocizzare i caricamenti. Un comportamento tipico di una pagina con interfaccia ajax è quello di caricare l'intera interfaccia con tutti i suoi javascript la prima volta che l'utente accede al sito, per poi proseguire solo con caricamenti in background. In questo modo l'utente non nota le interruzioni e le attese tipiche del reload dell'intera pagina e si trova a disposizione uno strumento piu agevole da utilizzare.