Introduction to Ajax
This was a paper I wrote about Ajax for one of my Master's classes. While it is not necessarily timely for most web developers, it may be of interest to IT managers and others not as closely connected to the web development field.
For the last couple years, the view of the web has been undergoing a change. Web applications that involve filling out forms, clicking submit, and getting a result are changing to behave more like desktop applications. Many active users of the web have experienced web sites like Google's maps and photo-sharing web site Flickr to see something newer, more dynamic, and more responsive. These web sites use a new web programming paradigm called AJAX.
The term AJAX was coined by Jesse James Garrett in a blog entry on February 18, 2005 (Lindquist 2006). The key components of AJAX are JavaScript and XML which are not new technologies. The JavaScript programming language has been a part of web browsers since 1995 and has traditionally been used for very basic improvements to the client side of web applications. XML grew out of SGML as a way to markup data so that it could be easily identified and exchanged between various systems. It was introduced as a standard in 1998 (Wikipedia 2006). Combing JavaScript and XML together, Garrett called this paradigm Asynchronous JavaScript And XML or AJAX, sometimes also written as Ajax.
In traditional web applications, most all of the programming logic is done on the server. The software on the server creates an HTML document that contains a web form and sends it to the web browser client. The user enters information or modifies the form before clicking a button in the form to send their input back to the server. The server receives the form, processes it, and sends results back to the client. In an Ajax application, JavaScript becomes the primary client within the web browser to communicate with the server. Instead of sending whole pages of data along with the HTML for layout, the server only sends specific data formatted in XML that the JavaScript client requests. Layout is done by the JavaScript client using XHTML and Cascading Style Sheets (CSS). Using the JavaScript client enables the dynamic updating of what the user sees in the browser window (Wikipedia 2006). While the initial loading of an Ajax application takes longer than a traditional web application, the subsequent page updates are much faster because only the portion of the page that is changing needs to be sent to the server and generate a response.
What are some examples of what an Ajax web application can do? When a user enters their ZIP code into a form, the browser could automatically complete their city and state in the form. When the user is trying to search a database for a name, the client might check the database for partial matches as the user types and offer a list of potential matches. When a user has uploaded a photo they wish to share with their friends and family and wants to adjust the colors as well as crop the photo to a different size, the user can do these simple edits using an Ajax application that communicates with the server to process the image and display the results.
There are some major web sites that are already using Ajax to great extent (O'Reilly 2005). Google Maps gives users an experience almost identical to mapping applications that can be installed on a desktop computer (Google Maps 2006). The user types in an address or a search term to see their items of interest marked on a map which they can quickly and easily zoom in, zoom out, and scroll. The map view is updated almost instantly because the JavaScript client downloads and receives just the information it needs to update the view rather than downloading the entire page again. The Flickr web site is a photo sharing system that gives users many different tools to not only organize their photos but also to edit them (Flickr 2006). The user is able to tag their photo with keywords without the browser having to reload the entire page including graphics and text that have nothing to do with the tags they edited or added. The dynamic interface not only impacts the way in which the user experiences an Ajax application but also greatly increases the responsiveness of it (Asaravala 2005). In this way, even a traditionally desktop-based application can be made into a web-based application like ajaxWrite has done in a word processor (ajaxWrite 2006).
While Ajax offers a great many benefits, it is not also without its issues that must be carefully considered when implementing an Ajax-based solution. One of the major concerns with Ajax is its accessibility for users with limitations (Jackson 2006). Web developers already struggle with making traditional applications accessible by people that are visually-impaired, and the move towards Ajax-based applications will not make that easier. Even those without visual impairments may be impacted by poorly designed Ajax applications (Wikipedia 2006). Developers must give users visual cues that a portion of the page is updating and must design their applications to accommodate network latency. Both of these issues are not ones that web developers have had to address in the past.
Ajax offers a way for web developers to give users a more desktop application-like experience in their web sites. There are already announcements of Ajax-based word processing applications, spreadsheet applications, and other traditionally desktop-based applications. Like any technology, CIOs, IS directors, and others must carefully weigh the benefits, obstacles, and issues with Ajax before moving forward to implement the technology.
References
ajaxWrite. (2006). The ajaxWrite web site accessed March 31, 2006, at http://www.ajaxwrite.com/.
Asaravala, Amit. (2005) "Putting AJAX to work." Infoworld. Accessed March 31, 2006, at <link>.
Flickr. (2006) The flickr.com web site accessed March 31, 2006, at http://www.flickr.com/.
Google Maps. (2006) Accessed March 31, 2006, at http://maps.google.com/.
Jackson, Joab. (2006). "Web browsers comply with Section 508." GCN. Accessed March 31, 2006, at <link >.
Lindquist, Christopher. (2006) "Ajax Arrives for Enterprise." CIO. Accessed March 28, 2006, at http://www.cio.com/archive/021506/et_article.html.
O’Reilly, Tim. (2006) "What is Web 2.0." Accessed March 31, 2006, at <link >.
Wikipedia. (2006) "Ajax (programming)." Accessed March 31, 2006, at http://en.wikipedia.org/wiki/AJAX.