130 likes | 258 Views
RESTfulness and AJAX. CS 4720 – Web & Mobile Systems. A Bright New Day with AJAX. Rich, responsive interfaces! Interactive pages! Fewer (if any) page refreshes! Able to withstand server issues!. AJAX: Official Definition.
E N D
RESTfulness and AJAX CS 4720 – Web & Mobile Systems
A Bright New Day with AJAX • Rich, responsive interfaces! • Interactive pages! • Fewer (if any) page refreshes! • Able to withstand server issues! 2
AJAX: Official Definition • From Ajax: A New Approach to Web Applications by Jesse James Garrett • Standards-based presentation with XHTML and CSS • Dynamic display and interaction with DOM • Data exchange and manipulation with XML • Asynchronous data retrieval with XMLHttpRequest • JavaScript holding it all together 3
How does it work? • Relies on two main principles: • 1. Ability to modify the current page and have the changes show • 2. Ability to send/receive requests without blocking the thread 4
Dynamic Display • The DOM: Document Object Model • In 1997, support for Dynamic HTML (DHTML) was added to major browsers • Allowed for the dynamic changing and redisplaying of the HTML element hierarchy • CSS (cascading style sheets) are a form of this too • Javascript can see the DOM and alter it on-the-fly 5
How do we not block? • Javascript is the main reason we can do this. • Javascript has no support for threads at all! It’s completely event driven. Events like: • A button press • A mouse over • A click • Or, most importantly, an HTTP request 6
XMLHttpRequest • An XMLHttpRequest encapsulates an HTTP request. • XMLHttpRequest support asynchronous invocation. • In other words, it just adds itself to the list of operations, but doesn’t lock resources. • Thus, the main thread is not blocked by the call, and the UI (or other system operations) can keep running in concert. 7
So… what do we send? • The name AJAX (Asynchronous Javascript and XML) would suggest that XML would be sent • But really, all you are doing is changing the DOM… so it could be anything • HTML (which is, of course, a form of XML) • Plain text (but that’s kinda boring) • Another formatted protocol (like SOAP) • Maybe even more Javascript 9
Here comes a pattern… • How does this jive with the observer pattern? • Who is observing? Who is publishing? 10
Example Code 11
Available Toolkits • You don’t still use normal arrays in Java do you? So why do that with AJAX? • Prototype • Script.aculo.us • Dojo • DWR • Moo.fx • jQuery • Etc. 12
Thanks • Many thanks to Ken Anderson @ Colorodo for some of this information • Some info also from the fine folks at Wikipedia • This slide deck brought to you by the letter “M” and the number “blue.” 13