AJAX stand for Asynchronous Javascript And XML, introduced by James Garret from Adaptive Path on 2005. he describe how to developing web differently from the traditional method. as traditional web development work synchronously, between the application & server. each time we click a link, or submitting a form, browser send the data to server, server respond & process it. then all the browser page reloaded. web application with AJAX, work asynchronously, which mean send & receive data from user to server without reloading whole page (only one/more tag component reloaded). AJAX can send & receive data between webserver & webbrowser backgroundly using XMLHttpRequest method in javascript.

in small server application which doing less process, this might be not a big deal. but in super big application, AJAX method might save about 30% than traditional method.

AJAX is not a new programming language, but a new technique using the existing standard. basicly AJAX work on javascript & http request.

AJAX based on open standard like :

  • Javascript
  • XML
  • HTML/XHTML
  • CSS

Traditional method :
using http request method.

Traditional model architecture

in this model, server send response filled with all html page including header, logo, navigation, footer etc. when user click a link, server will reload a full new page (header,logo,footer,navigation). and continuesly each user send new http request.

AJAX method :
need to be remember that AJAX can communicate with server without refreshing whole page (with XMLHttpRequest method in Javascript). this concept totally different than traditional method described above. in AJAX model, action from client divided by 2 part, user interface layer & AJAX layer. when user click a link or submit a form, the input handled by AJAX layer, sent to processed by server, output will be updated on user interface (UI).

AJAX model architecture

in AJAX layer, all communication handled by AJAX engine, this usually a Javascript function called when client need information from server. what AJAX engine do are handling request from client, receive needed response from server, parsing the data, and show it on client browser in mentioned component id without reload all page document.

behind AJAX technology :