But interactions confined to a page level seemed somewhat stifling. So along came DHTML, the combination of HTML, CSS and JavaScript. Parts of the page could change instantaneously based on the user’s interaction without requiring a hit to the server. Information designers had a new tool to better manage screen real estate and interaction designers had a new tool for more discrete, sub-page level interactions. But DHTML interactions are fundamentally constrained. They can only manipulate information that is brought down to the client when the page initially loads. You can only bring down so much information at page load before the user gets frustrated with the initial load time.

 

Finally a subtle but powerful protocol was introduced by Microsoft - the XMLHttpRequest. It provided an API that can be used by JavaScript to establish asynchronous communication between the client and server. We were freed from the “new-information-from-server-requires-new-page load” constraint. By combining the power of webpage information manipulation of DHTML and the freedom of selectively exchanging relevant streams of data with the server in the background, the more rich and interactive user experiences of AJAX enhanced webpages were born.

 

Ultimately AJAX potentially affords improvements to the user experience by optimizing the two main factors in website performance – calls to the server and transmission of data to the client. As a result, AJAX can offer the following benefits and drawbacks:

 

Benefits

 Drawbacks

While many AJAX toolkits are beginning to address these drawbacks, designers and developers need to assess whether the benefits of an AJAX enhanced user experience sufficiently outweighs the accompanying drawbacks.