What is AJAX

Document Sample
What is AJAX Powered By Docstoc
					Recently, the term Ajax has gotten a lot of attention in web design, becoming one00:04of the most used
buzzwords in recent memory.00:07Now despite this attention, there is still a great deal of confusion
over just what Ajax is.00:12Before discussing what Ajax is, I want to take a moment to define what Ajax
isn't.00:17First of, Ajax is not a new technology.00:20It is not a programming language or a scripting
software.00:23In fact, Ajax isn't any one thing at all.00:26Ajax is actually a very loose term that refers to
the development of interactive00:31applications, widgets, and interfaces through the use of existing
technologies.00:35It is short for Asynchronous JavaScript and XML.00:39And the name denotes the two
technologies that form the core of most Ajax00:44driven applications.00:45Most Ajax applications make
heavy use of HTML, CSS and the DOM, or Document00:51Object Model, for structure, formatting, and
element interaction.00:55None of these technologies are new to web development.00:57So rather than
thinking of Ajax as a new technology, you should think of it01:01more as a specific approach to web
development that focuses on building01:06engaging user experiences.01:08Ajax is a huge subject and
there are entire books and titles on some of the01:12various aspects of it.01:13Rather than trying to
cover everything in five minutes, I want to explain Ajax01:17by breaking down a typical Ajax
application.01:19This will help show the advantages to using Ajax and why it is
becoming01:23increasingly more popular.01:25Let's say you have a website that allows the user to
browse and purchase01:28paintings from several artists.01:30You may want to first show a list of all
paintings available, including a01:33thumbnail of the painting, the artist, medium used, and
price.01:37Most shoppers would want more detailed inspection of the artwork, so you'd like01:41them
to be able to select an individual painting and learn more about it.01:44Now traditionally, most of this
process would be handled by server-side01:48application software.01:49You would create a database of
the artwork, and then create an initial page that01:53dynamically populates the list, based on the
database.01:56Clicking on one of the paintings would traditionally take you to what is known01:59as
the Detail Page where additional information would be presented from the02:03database, based on
which item is clicked.02:06To return to the list, the user would browse back to the listing
page.02:09Now while functional, this approach highlights a glaring deficiency with most02:13server-side
applications.02:15In order to update the data, a new request must be made to the server, which
then02:19must refresh the entire page.02:22Even something as simple as sorting the table by Price or
Artist would require a page refresh.02:28Ajax applications can take advantage of JavaScript's ability to
make request02:32to the server in the background, and return data without requiring the
entire02:36page to be refreshed.02:37Data can be stored in an XML file or JavaScript
object,02:41allowing data to be sorted or refresh from within the client without
requiring02:45interaction from the server.02:47Let's return to our application to see how the interface
can be improved through Ajax.02:51The list of paintings can still be retrieved from the existing database,
but02:55through Ajax, the list can be sorted by Price, Title, or Artist without03:00requiring the page to
be refreshed.03:02More importantly, clicking on the painting will now update a detailed
region03:06created on the fly by JavaScript, animated for enhanced user experience and
then03:11populated asynchronously through a JavaScript request to the server.03:15This creates a
much more compelling user experience.03:17It is faster for the end-user and in many ways, uses less
bandwidth, as it03:22only request information the information it needs each time, instead
of03:25refreshing the entire page.03:27I'm sure by now that you've caught on that Ajax driven
applications have many03:30moving parts, and require a high degree of specialization to
build.03:34Many web designers decide to specialize in building Ajax applications and it is03:39often
necessary to engage their services for complex solutions.03:42However, if Ajax development interest
you, I would suggest mastering HTML and03:46CSS, learning JavaScript, utilizing XML, and focus on
manipulating the03:51Document Object model.

Shared By: