Download Slide 1

www.themaninblue.com
Jumping on the AJAX
bandwagon
By Cameron Adams, 2006-04-06
www.themaninblue.com
www.themaninblue.com
Ajax: A New Approach to Web Applications
February 18, 2005
http://www.adaptivepath.com/publications/essays/archives/000385.php
www.themaninblue.com
www.themaninblue.com
AJAX
www.themaninblue.com
Asynchronous
JAvaScript
and
XML
www.themaninblue.com
Asynchronous
JAvaScript
and
XML
www.themaninblue.com
Asynchronous
JAvaScript
and
XML
www.themaninblue.com
Asynchronous
JAvaScript
and
XML
www.themaninblue.com
and
www.themaninblue.com
www.themaninblue.com
Asynchronous
www.themaninblue.com
Asynchronous
Traditional browser request
www.themaninblue.com
Asynchronous
Traditional browser request
www.themaninblue.com
Asynchronous
Traditional browser request
www.themaninblue.com
Asynchronous
Traditional browser request
www.themaninblue.com
Asynchronous
AJAX request
www.themaninblue.com
Asynchronous
AJAX request
www.themaninblue.com
Asynchronous
AJAX request
www.themaninblue.com
Asynchronous
AJAX request
www.themaninblue.com
JavaScript
www.themaninblue.com
JavaScript
www.themaninblue.com
JavaScript
• Captures interaction – Creates interaction
• Initiates/receives communication
• Rewrites the page
www.themaninblue.com
JavaScript
www.themaninblue.com
XML
www.themaninblue.com
XML
• Who cares about XML?
• It’s easier to use plain text/HTML or JSON
www.themaninblue.com
Advantages of AJAX
www.themaninblue.com
Advantages of AJAX
More usable interfaces
maps.yahoo.com
maps.google.com
www.themaninblue.com
Advantages of AJAX
Unique interaction
photosite.com
flickr.com
www.themaninblue.com
Advantages of AJAX
Portable
IM clients
meebo.com
www.themaninblue.com
Advantages of AJAX
Small & Invisible
Red Sherrif
Google Analytics
www.themaninblue.com
Advantages of AJAX
Collaboration
www.themaninblue.com
Advantages of AJAX
Collaboration
Maps, maps, everywhere:
www.plazes.com
www.communitywalk.com
homesold.fidelitylabs.com
www.chicagocrime.org
www.wayfaring.com
dartmaps.mackers.com
www.gawker.com/stalker
maps.webfoot.com
www.dudewheresmyusedcar.com
austin.adactio.com
www.beerhunter.ca
www.themaninblue.com
Advantages of AJAX
Collaboration
www.mindsack.com/?page_id=45
api.local.yahoo.com/eb
johnvey.com/features/deliciousdirector
www.themaninblue.com
Disadvantages of AJAX
www.themaninblue.com
Disadvantages of AJAX
JavaScript off
• meebo.com
• Google Maps handles it OK
• Jeremy Keith calls “Hijax” good practice
(http://domscripting.com/blog/display/41)
www.themaninblue.com
Disadvantages of AJAX
Usability
• New styles of interaction (to the Web) –
drag and drop, in-place editing
(projects.backbase.com/RUI/shop.html –
what the hell do I do!?!?)
• Feedback on state/changes
• The back button (news.google.com)
www.themaninblue.com
Disadvantages of AJAX
Accessibility
• JavaScript accessibility in general
• No solid solutions for AJAX – most
screenreaders allow JavaScript but cannot
detect page changes
www.themaninblue.com
Developing with AJAX
www.themaninblue.com
Developing with AJAX
Server-side Programming
“Plan for Ajax from the start. Implement Ajax
at the end.”
www.themaninblue.com
Developing with AJAX
Client-side Programming
Four “Quantum States” of AJAX – Kevin
Hakman
www.themaninblue.com
Developing with AJAX
Client-side Programming
Level 1– Communication libraries:
SAJAX (www.modernmethod.com/sajax)
Prototype (prototype.conio.net)
www.themaninblue.com
Developing with AJAX
Client-side Programming
Level 2– GUI components:
RICO (openrico.org)
Yahoo UI Library (developer.yahoo.com/yui)
www.themaninblue.com
Developing with AJAX
Client-side Programming
Level 3 – Rich Internet Application (RIA)
Frameworks :
Backbase (www.backbase.com)
Tibco (www.tibco.com/software/ria/gi_resource_center.jsp)
Isomorphic (www.isomorphic.com)
www.themaninblue.com
Developing with AJAX
Client-side Programming
Level 4 – RIA Frameworks + Visual Toolkits:
Backbase (www.backbase.com)
Tibco (www.tibco.com/software/ria/gi_resource_center.jsp)
Microsoft Atlas (atlas.asp.net)
www.themaninblue.com
How should I use AJAX?
www.themaninblue.com
How should I use AJAX?
Applications vs. Web pages
Should everything on the Web use a pagebased model?
www.themaninblue.com
What’s the future of AJAX?
The new interaction is here to stay
JJG: “AJAX is the next step. I don’t think it is the
last step. What we ultimately end up with on the
Web is something that will be rooted in this
approach, but it may not use these particular
technologies. Conceptually, decoupling user
interaction from server communication is here to
stay.”
www.themaninblue.com
www.themaninblue.com