Your SlideShare is downloading. ×
01 Ajax Intro
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.


Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

01 Ajax Intro


Published on

AJAX Intro

AJAX Intro

Published in: Education, Technology

1 Like
  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide
  • Transcript

    • 1. AJAX A Brief Introduction to AJAX
    • 2. AJAX Defined
      • Jesse James Garrett 2/18/05
        • – Hype Ground 0
        • Defines AJAX:
          • “ Ajax isn’t a technology. It’s really several technologies, each flourishing in its own right, coming together in powerful new ways. Ajax incorporates:
          • standards-based presentation using XHTML and CSS;
          • dynamic display and interaction using the Document Object Model;
          • data interchange and manipulation using XML and XSLT;
          • asynchronous data retrieval using XMLHttpRequest;
          • and JavaScript binding everything together.”
    • 3. AJAX?
      • Asynchronous JavaScript and XML
        • Doesn’t have to be XML being transmitted – can be any data e.g. HTML
      • AJAX has become the new popular umbrella term that includes DHTML and Web 2.0 types of websites. Examples include:
        • Google Maps,, Google Suggest,,
    • 4. Better than Flash?
      • AJAX and Flash Compared
        • Depends on the needs of the application
    • 5. AJAX 101
      • History: “Microsoft first implemented the XMLHttpRequest object in Internet Explorer 5 for Windows as an ActiveX object. Engineers on the Mozilla project implemented a compatible native version for Mozilla 1.0 (and Netscape 7). Apple has done the same starting with Safari 1.2.”
      • AJAX is special because so many browsers support it out of the box.
    • 6. AJAX 101: XMLHttpRequest
      • XMLHttpRequest performs an HTTP GET or POST in the background (asynchronously) then calls a JavaScript function when it’s done.
      • The XMLHttpRequest is a JavaScript object that offers a convenient way for web pages to get information from servers without refreshing themselves.
    • 7. AJAX 101: XMLHttpRequest
      • The benefit to end users is that they don't have to type as much and they don't have to wait as long.
        • For example, having the user's city and state show up in a webpage automatically after the ZIP code has been typed in is a big time saver.
      • A good way to think of the XMLHttpRequest object is as you would think of the JavaScript Image object. When a mouseover is performed the next images loads without reloading the page.
    • 8. A Client/Server Computing Model Client Computer Browser Server Computer HTTP Service HTTP REQUEST HTTP RESPONSE (URL,Post,Get,..) (XHTML...) A State-less Environment
    • 9. Client Browser (state A) HTTP Server HTTP REQUEST HTTP RESPONSE New Page Default Synchronous Processing Scenario Client Browser (state B) (state A) (state A + … = state B)
    • 10. Client Browser (state D) Client Browser (state A) HTTP Server REQUEST RESPONSE – New Page Asynchronous Processing Scenario Client Browser (state C) Client Browser (state B) REQUEST/RESPONSE REQUEST/RESPONSE Using XMLHttpRequest Object
    • 11. AJAX Gotchas
      • Back Button doesn’t work “right”
      • Bookmarks do not work “right”
      • Many “solutions” are starting to come out
        • How to Handle Bookmarks and Back Buttons
        • by Brad Neuberg
      • JavaScript Versions and History
    • 12. What to do next
      • Read and practice
        • Use XAMPP or buy a cheap web hosting account.
          • XAMPP is a free easily installable Web development environment for Windows, Linux & OS X
        • Visit live AJAX demo sites:
    • 13. Book: AJAX in Action
      • Ajax in Action
        • by Dave Crane and Eric Pascarello with Darren James
        • Screencasts at
          • Four Minute Overview:
          • Twenty-two Minute walkthru:
    • 14. Blog:
      • has good podcast episode summaries online
      • Episode 11
        • Rate it up by order of magnitude – that’s ROI
        • Scriptaclous guy
        • XML and DOM manip is really slow only use if you have pre-existing XML api
        • Prototype extends object and array and this causes problems with other libraries.
    • 15. Credits
      • Professor Stephen K. Kwan
      • AJAXIAN
      • AJAX Matters