Asynchronous JavaScript And
XML
Gloria Law
Joshua Mahaz
11/13/2007
Asynchronous JavaScript And XML

Technique for creating web applications that
are…
faster
 more functional
 real-time


Achieved through client/server communication
without page reloads
11/13/2007
AJAX a New Name

Components have been around since mid 90’s
Microsoft Remote Scripting
 IFRAME (IE3)
 LAYER (Netscape 4)


Provided a means of loading external URLs that
could modify a parent page.
11/13/2007
AJAX a New Name

Requirements
Plugs-ins
 Browser specific add-ons


Repercussions
Hassle of third party software
 Page was always browser specific

11/13/2007
AJAX a New Name

Advancements in Web Development 2000+

Widespread adoption and refinement of
Client Side Scripting (JavaScript)
 Server Side Scripting (PHP/SQL/ASP)
 XML Request (Microsoft Remote Scripting)


Aloud for an easier, portable, and more refined
approach, AJAX
11/13/2007
Asynchronous JavaScript And XML


Technique for creating better, faster, and more
interactive web application
JavaScript can communicate directly with server



scripting language in which Ajax function calls are usually
made
Uses asynchronous data transfer (HTTP requests)
between the browser and the web server
Can use on different OS, free and open source
implementations of suitable
11/13/2007
Usage

Real-time form data validation


Auto completion


Portion of form data may be auto completed as the user
types
Load on demand


Can validate in a form before the user submit the form
An HTML page can fetch more data in the background
Refreshing data and server push


Pull data from a server for a up-to-date data
Not require to reload the full page
11/13/2007
Advantage

Bandwidth usage
Quicker loads
 Rest of the layout does not have to be redrawn on
each update


Compatibility

Works on ‘most’ browsers
11/13/2007
Advantage

Functionality


Constant data fetching allows page to stay ahead of
user
JavaScript event handler gives page a real-time
feel
Mouse click
 Focus changes
 Timers/Interrupts

11/13/2007
Disadvantage

Browser Integration


Complexity


Need to have some knowledge of presentation logic in the
HTML client page as well as in the server-side logic
Response-time concern


Does not register itself with the browser history engine
Network latency
Debugging

Processing logic is embedded both in the client and on the
server.
11/13/2007
Demo
Web-based demo:
http://www.Mahaz.com
11/13/2007
Reference








http://www.adaptivepath.com/ideas/essays/archives/000385.ph
p
http://devedge-temp.mozilla.org/viewsource/2003/innerbrowsing/index_en.html
http://groups.google.ca/group/microsoft.public.scripting.remot
e/browse_thread/thread/99b7e6152b45b2e7/6b3689e2dc7401d
c
http://arscif.dsi.unimi.it/
http://msdn.microsoft.com/msdnmag/issues/04/08/CuttingE
dge/
http://www.ietf.org/rfc/rfc2396.txt
http://www.ietf.org/rfc/rfc3986.txt
http://www.xml.com/pub/a/2005/08/22/ajax.html
11/13/2007