1. Rich Internet Applications
Software evolution always
seems to happen in this typical fashion: Once a technology is grounded
firmly (meaning the connections between the parts work and the
architecture is fundamentally sound), upgrading the end user's
experience becomes a much higher priority. Application technology is in
this stage, and the general term for this kind of application is a Rich
Internet Application (RIA). AJAX is one means of producing Rich Internet
Applications. (Microsoft Silverlight is another popular means of
creating RIAs.)
The primary reason for the
existence of AJAX is to improve the standard HTTP GET/POST idiom with
which Web users are so familiar. That is, the standard Web protocol in
which entire forms and pages are sent between the client and the server is getting a whole new addition.
Although standard HTTP is functional and well understood by Web developers, it does have certain drawbacks—the
primary one is that the user is forced to wait for relatively long
periods while pages refresh. This has been a common problem in all
event-driven interfaces. (The Windows operating system is one of the
best examples.) AJAX introduces technology that shields end users from
having to wait for a whole page to post.
Think back to the way HTTP
typically works. When you make a request (using GET or POST, for
example), the Web browser sends the request to the server, but you can
do nothing until the request finishes. That is, you make the request and
wait—watching the little progress indicator in the browser. When the
request returns to the browser, you can begin using the application
again. The application is basically useless until the request returns.
In some cases, the browser's window even goes completely blank. Web
browsers have to
wait for Web sites to finish an HTTP request in much the same way that
Windows-based programs have to wait for message handlers to complete
their processing. (Actually, if the client browser uses a multithreaded
user interface such as Windows Internet
Explorer, users can usually cancel the request—but that's all they can
really do.) You can easily demonstrate this problem by introducing a
call to System.Threading.Thread.Sleep inside the Page_Load method of an ASPX page. By putting the thread to sleep, you force the end user to wait for the request to finish.
The AJAX solution to this problem is to introduce some way to handle the request asynchronously. What if there were a way to introduce asynchronous
background processing into a Web site so that the browser would appear
much more responsive to the user? What if (for certain applications)
making an HTTP request didn't stall the entire browser for the duration
of the request, but instead seemed to run the request in the background,
leaving the foreground unhindered and changing only the necessary
portion of the rendered page? The site would present a much more
continuous and smooth look and feel to the user. As another example,
what if ASP.NET included some controls that injected script into the
rendered pages that modified the HTML Document Object Model, providing
more interaction from the client's point of view? Well, that's exactly
what ASP.NET AJAX support is designed to do.
2. What Is AJAX?
AJAX formalizes a style of programming meant to improve the UI responsiveness
and visual appeal of Web sites. Many AJAX capabilities have been
available for a while now. AJAX consolidates several good ideas and uses
them to define a style of programming and extends the standard HTTP
mechanism that is the backbone of the Internet. Like most Web
application development environments, ASP.NET takes advantage of HTTP
capabilities in a very standard way. The browser usually initiates
contact with the server using an HTTP GET request, followed by any
number of POSTs. The high-level application flow is predicated upon
sending a whole request and then waiting
for an entire reply from the server. Although the ASP.NET server-side
control architecture greatly improves back-end programming, users still
get their information a whole page at a time. It operates almost like
the mainframe/terminal model popular during the 1970s and early 1980s.
However, this time the terminal is one of many modern sophisticated
browsers and the mainframe is replaced by a Web server (or Web farm).
The standard HTTP round-trip has
been a useful application strategy, and the Web grew up using it. While
the Web was developing in the late 1990s, browsers had widely varying
degrees of functionality. For example, browsers ranged all the way from
the rudimentary America Online Browser (which had very limited capabilities) to
cell phones and personal digital assistants (PDAs), to more
sophisticated browsers such as Internet Explorer and Netscape Navigator,
which were rich in capability. For instance, Internet Explorer supports
higher level features such as JavaScript and Dynamic HTML. This made
striking a balance between usability of your site and the reach of your site very difficult prior to the advent of ASP.NET.
However, the majority of modern
computing platforms can run a decent browser that can process
client-side scripting. These days, most computing environments run a
modern operating system, such as the Windows Vista or Windows 7
operating systems, or even Macintosh OS X. These environments run
browsers fully capable of supporting XML and JavaScript. With so many
Web client platforms supporting this functionality, it makes sense to
take advantage of the capabilities.
In addition to extending standard HTTP, AJAX is also a very clever way to use the Web
service idiom. Web services are traditionally geared toward
enterprise-to-enterprise business communications. However, Web services
are also useful on a smaller scale for handling Web requests
out of band. ("Out of band" simply means making HTTP requests using
other methods instead of the standard page posting mechanism.) AJAX uses
Web services behind the scenes to make the client UI more responsive
than it is for traditional HTTP GETs and POSTs.
3. ASP.NET and AJAX
One of the primary changes AJAX
brings to Web programming is that it depends on the browser taking an
even more active role in the process. Instead of the browser simply
rendering streams of HTML and executing small custom-written script
blocks, AJAX includes some new client-script libraries to facilitate the
asynchronous calls back to the server. AJAX also includes some basic
server-side components to support these new asynchronous calls coming
from the client. There's even a community-supported AJAX Control Toolkit
available for the ASP.NET AJAX implementation. Figure 1 shows the organization of ASP.NET AJAX support.
3.1. Reasons to Use AJAX
If traditional ASP.NET
development is so entrenched and well established, why would you want to
introduce AJAX? At first glance, AJAX seems to introduce some new
complexities into the ASP.NET programming picture. In fact, it seems to
reintroduce some programming idioms that ASP.NET was designed to
deprecate (such as overuse of client-side script). However, AJAX
promises to produce a richer experience for the user. Because ASP.NET
support for AJAX is nearly seamless, the added complexities are well
mitigated. When building a Web site, there are a few reasons you might
choose to enable your ASP.NET site for AJAX:
AJAX improves the
overall efficiency of your site by performing, when appropriate, parts
of a Web page's processing in the browser. Instead of waiting for the
entire HTTP protocol to get a response from the browser, you can push
certain parts of the page processing to the client to help the client to
react much more quickly. Of course, this type of functionality has
always been available—as long as you're willing to write the code to
make it happen. ASP.NET AJAX
support includes a number of scripts so that you can get a lot of
browser-based efficiency by simply using a few server-side controls.
ASP.NET
AJAX introduces to a Web site UI elements usually found in desktop
applications, such as rectangle rounding, callouts, progress indicators,
and pop-up windows that work for a wide range of browsers (more browser-side scripting—but most of it has been written for you).
AJAX introduces partial-page
updates. By refreshing only the parts of the Web page that have been
updated, the user's wait time is reduced significantly. This brings
Web-based applications much closer to desktop applications with regard
to perceived UI performance.
AJAX
is supported by most popular browsers—not just Internet Explorer. It
works for Mozilla Firefox and Apple Safari, too. Although it still
requires some effort to strike a balance between UI richness and the
ability to reach a wider audience, the fact that AJAX depends on
features available in most modern browsers makes this balance much
easier to achieve.
AJAX introduces a huge number of new capabilities. Whereas the standard ASP.NET
control and page-rendering model provides great flexibility and
extensibility for programming Web sites, AJAX brings in a new
concept—the extender control. Extender controls attach to existing server-side controls (such as the TextBox, ListBox, and DropDownList) at run time and add new client-side appearances and behaviors to the controls. Sometimes extender controls can even call a predefined Web service to get data to populate list boxes and such (for example, the AutoComplete extender).
AJAX improves on ASP.NET Forms Authentication and profiles and personalization
services. ASP.NET support for authentication and personalization
provides a great boon to Web developers—and AJAX just sweetens the
offerings.
These days, when you browse different Web sites, you run into many examples of AJAX-style programming. Here are some examples:
3.2. Real-World AJAX
Throughout the 1990s and into
the mid-2000s, Web applications were nearly a throwback to 1970s
mainframe and minicomputer architectures. However, instead of a single
large computer serving dumb terminals, Web applications consist of a Web
server (or a Web farm) connected to smart browsers capable of fairly
sophisticated rendering capabilities. Until recently, Web applications
took their input from HTTP forms and presented output in HTML pages. The
real trick in understanding standard Web applications is to see the
disconnected and stateless nature of HTTP. Classic Web applications can
show only a snapshot of the state of the application.
Microsoft supports standard AJAX idioms and patterns in the ASP.NET framework. However, AJAX is more a style of Web programming involving out-of-band HTTP requests than any specific technology.
You've no doubt seen
sites engaging the new interface features and stylings available through
AJAX programming. Examples include Microsoft.com, Google.com, and
Yahoo.com. Very often while browsing these sites, you'll see modern
features such as automatic page updates that do not require you to
generate a postback explicitly. Modal-type dialog boxes that require
your attention appear until you dismiss them. These are all features
available through AJAX-style programming patterns and the ASP.NET
extensions (for example, a rich set of AJAX server-side controls and
extensions) for supporting AJAX.
If you're a long-time
Microsoft environment Web developer, you might be asking yourself
whether AJAX is something really worthwhile or whether you might be able
to get much of the same type of functionality using a tried and true
technology such as DHTML.
3.3. AJAX in Perspective
Any seasoned Web developer targeting Internet Explorer as the browser is undoubtedly familiar with Dynamic HTML (DHTML). DHTML
is a technology that runs at the browser for enabling Windows
desktop-style UI elements in the Web client environment. DHTML was a
good start, and AJAX brings the promise of more desktop-like
capabilities to Web applications.
AJAX makes available
wider capabilities than DHTML does. With DHTML, primarily you can change
the style declarations of an HTML element through JavaScript. However,
that's about as far as it goes. DHTML is very useful for implementing
such UI features as having a menu open when the mouse pointer rests on
it. AJAX expands on this idea of client-based UI using JavaScript as
well as out-of-band calls to the server. Because AJAX is based on
out-of-band server requests (rather than relying only on a lot of client script code), AJAX has the potential for much more growth in terms of future capabilities than does DHTML.