1. 5/3/2006 Mike/Justin/JYoo AJAX/SOAP/Comet 1 Cleaning up the Internet Using AJAX, SOAP and Comet CS526 Mike Gerschefske Justin Gray James Yoo 02 May 2006

2. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet2 How Web Applications Work Google […] User Requests Web Page either by clicking a button or entering a URL The entire page is changed and reloaded with the server response Documents are forced to be ‘heavy’, displaying new information requires a new page request Title UI Table HTTP GET http://www.google.com/http://www.google.com/ Or HTTP POST […]

3. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet3 How Web Applications Work Title UI Table Title UI Table User interaction (e.g. button click) causes a complete page reload This causes a complete page reload to occur on the browser Browser is forced to reload entire document tree Browser is forced to request all SRC tags (caching can help with this) Server has to send ENTIRE document to client -- often consuming bandwidth With large documents, multiple packets and latency can cause longer browser load times Problems

4. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet4 IFrame – Moving Forward Right Direction Provides a way to not pull entire page Wrong Implementation Send meta-data and document formatting with every page load Need a way to send just data to reduce bandwidth and decrease response time Title UI Table UI Table User interaction (e.g. button click) causes a smaller reload of certain sections of the web page Google […] […] onButtonClick = { IFRAME.Dynamic.SRC = mynewpage.html } [Document Subset]

5. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet5 XMLHttp – A better way Title UI Table Document User interaction (e.g. button click) causes a document request Microsoft created XMLHttp (Active X) browser plugin to allow dynamic HTTP GET/POST Mozilla realized this was good and created XMLHttpRequest Good idea, but nothing is standardized Name is deceiving, can be XML but is really document exchange A simple way to request DATA What does this really provide us? The Browser Wars

6. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet6 So what is AJAX? Asynchronous JavaScript And XML This is a pattern, not a product This is a browser web based design pattern The use of XMLHttp/XmlHttpRequest to request XML based documents and use JavaScript to render them on the browser If its not Asynchronous, JavaScript or XML it’s not AJAX it’s something else – not necessarily a bad thing Why is this better? Enriches user experience by making web application feel more responsive Helps minimize traffic – server only sends data in XML apposed to HTML Minimized traffic helps reduce overall browser loading

7. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet7 The Missing Link How the browser fits a SOA One implementation is SOAP based web services SOAP encapsulates XML in a standardized XML format The browser is able to consume those web services example: Can use web services to order books, check stocks and weather from multiple companies all on one web page Problems SOAP consumption is not built into the browser Messages have to be manually built and parsed Microsoft tried to build this functionality into a Javascript file, but didn’t work out Ultimately needs to be put in the browser Lack of standardization between browsers

8. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet8 The next problem Browsers request data – servers send it With a request/response architecture, the client isn’t always aware if it should be asking for data i.e. a user is watching stocks request/response user has to actively ‘refresh’ a document exchange to see if the stock has changed – very wasteful as the user may over request, or under request and not be updated in time some implentations to address this involved JavaScript timers to pull on intervals Solution Another design pattern needed to allow more of a publish/subscribe model apposed to a request/response one

9. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet9 Comet About Comet Comet, again, is just a design pattern Comet takes the TCP stream being sent to the browser and keeps it open With the stream open, the server ‘flushes’ (or pushes) the data to the client when ever the server deems necessary XMLHttp/Request is able to process this flushed data and maintain the open connection Makes the browser a serious contender for developing any new application Problems The TCP keep-alive is not exactly supported in web servers Lots of hacks exist to do it, Apache soon to support Not all browsers have a call-back to support this, so may wind up with timer client side, checking if new information arrived

10. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet10 SOAP, AJAX and Comet Is it Cleaner? Based of the names, one would think so… Lack of standardized implementations isn’t Asynchronous good, pub/sub good, move towards SOA model good, we’re on the right track When to use it… Not all applications should be web based (local) Processor intensive, graphic intensive, etc. If users require only small sub sets of data, yet have to request large HTML documents to get it, AJAX If a pub/sub architecture is needed (meebo) Comet

11. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet11 Looking Forward AJAX forces XML to the client which: Can provide last minute-outer edge firewalling Makes ‘services’ and web page functionality more modular Can decrease bandwidth consumption Comet provides server side call backs Something WSE (Web Service Eventing) tried creating Eliminates wasteful request/response model AJAX + Comet = ??? Next generation web applications Online equiv to Microsoft Word Microsoft Office Online Ruby on Rails Push for new companies offering “services” Backup services Have Browser? Will work!

12. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet12 Demo Live AJAX/SOAP Demo

13. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet13 Questions Questions and Comments are Welcome

14. 5/3/2006Mike/Justin/JYoo AJAX/SOAP/Comet14 What is AJAX Asynchronous Javascript And XML Used in creating web application