08AJAX - Introduction to AJAX CS5281 Internet Application...

Info iconThis preview shows pages 1–12. Sign up to view the full content.

View Full Document Right Arrow Icon
CS5281 Internet Application Development Introduction to AJAX
Background image of page 1

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
CS5281 Internet Application Development History of AJAX s Authored by Adaptive Path in mid February 2005 s Stands for “Asynchronous JavaScript + XML” s Famous examples : Google Maps , Google Suggest , GMail s New bottle of old wine s Also known as XMLHTTP technique s Core techniques are centered around asynchronous communication to the server without a page refresh
Background image of page 2
CS5281 Internet Application Development What exactly is AJAX in technical point of view s Ajax incorporates b standards-based presentation using XHTML and CSS ; b dynamic display and interaction using the Document Object Model ; b data interchange and manipulation possibly using XML; b asynchronous data retrieval using XMLHttpRequest ; b and JavaScript binding everything together.
Background image of page 3

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
CS5281 Internet Application Development So why is AJAX so hot NOW? s Demand for richer applications is growing s AJAX only send/receive necessary data, hence the required bandwidth is reduced considerably (about 5% of full page) b More clients can be supported concurrently b Processing Delay can be reduced s Recent Google applications have sparked people’s imagination b Google gmail, Google suggests, Google Maps s People are thinking of building APPLICATIONS…not just sites
Background image of page 4
CS5281 Internet Application Development So why is AJAX so hot NOW? Users are demanding Rich Internet Applications AJAX + Tools + Framework + Controls = Rich Internet Apps s No new infrastructure needed b Utilize existing skills s Much richer GUI than today b Meets most users needs for responsiveness b Much faster response times s No distribution hassles s Cross-Platform Browser Support s Reduced bandwidth utilization s Vendors implementing AJAX frameworks s Developer sites + open source frameworks
Background image of page 5

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
CS5281 Internet Application Development Traditional Web App v.s. AJAX s Traditional Web Applications b Unit of work is a page b Page refresh for each submit s AJAX b Unit of work is a component b Data is sent incrementally b Client code has validation, flow, data interchange b Only parts of pages are updated at a time
Background image of page 6
CS5281 Internet Application Development Traditional Web App v.s. AJAX
Background image of page 7

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
CS5281 Internet Application Development Classic web application model (synchronous)
Background image of page 8
CS5281 Internet Application Development Ajax web application model (asynchronous)
Background image of page 9

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
CS5281 Internet Application Development AJAX life cycle action event fetch data server filter data reaction User enter text in form, or trigger some event (e.g. onkeyup, onchange…etc) Browser makes a server request by XMLHttpRequest(), contacting some server page (such as PHP) Browser receive response and update the page using DOM model and Javascript
Background image of page 10
CS5281 Internet Application Development Talking with the server s XMLHTTPRequest object b Allows for asynchronous GETs + POSTs to the server b Does not show the user anything—no status messages b Can have multiple XMLHTTPRequest active at one time b Allows you to specify a handler method for state changes
Background image of page 11

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
Image of page 12
This is the end of the preview. Sign up to access the rest of the document.

{[ snackBarMessage ]}

Page1 / 34

08AJAX - Introduction to AJAX CS5281 Internet Application...

This preview shows document pages 1 - 12. Sign up to view the full document.

View Full Document Right Arrow Icon
Ask a homework question - tutors are online