we can help IT

  • Home
  • IT Leadership
  • IT Management
  • IT Services
  • About
  • Resume
  • Contact

Tags in Tags

business-IT alignment Drupal EDUCAUSE game higher education innovation IT@Illinois leadership operational IT professional development relationship management strategic IT
more tags

User login

Image CAPTCHA
Enter the characters shown in the image. Ignore spaces and be careful about upper and lower case.
  • Create new account
  • Request new password

Older articles

Review: Here Comes Everybody - Jul 8, 2009
Drupal for small business - Jun 7, 2009
State of the IT@Illinois - May 4, 2009
Central IT, governance, and shifting the stack - Feb 19, 2009
IT@Illinois kicks off - Dec 11, 2008
Competitive advantage from IT - Jul 24, 2008
iPhone Review: After 1 week - Jul 22, 2008
The Savvy Manager - Jul 20, 2008
Thoughts on Technology Accelerators - Jul 14, 2008
Does IT matter to higher education? - Jul 8, 2008
Home

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.

Tags:
  • ajax
  • Graduate School
  • Web

mikeb's tweets

  • #ITatIL in DCL, WordPress discussion in MechSE, now #WebAtIL in FLB. Busy and awesomely productive day — 4 days 12 hours ago
  • @jeffjarvis EnterpriseWorks at the University of Illinois is one http://researchpark.illinois.edu/facilities/enterpriseworks/ — 1 week 3 days ago
  • has anyone else been having problems today using the #dell chat for tech support? — 1 week 4 days ago
  • @tmsweet @sshreeves you're making me hungry for Paco's Tacos. a yummy taqueria on the South Side. lengua and barbacoa are the best — 1 week 5 days ago
  • RT @TechCrunch OpenStack.org: RackSpace Open Sources Their Cloud Services Platform, And Gets NASA On Board http://tcrn.ch/9Yp89M — 1 week 5 days ago
more
I love Smashing Magazine!

© 2009 Michael Bohlmann

Fervens Drupal theme by Leow Kah Thong. Designed by Design Disease and brought to you by Smashing Magazine.