今S aJaX Basics Sang shin Java Technology architect Sun Microsystems, Inc. sangshin@sun.com Www.javapassiOn.com
AJAX Basics Sang Shin Java Technology Architect Sun Microsystems, Inc. sang.shin@sun.com www.javapassion.com
令Sn Disclaimer Acknowledgments Even though Sang Shin is a full-time employee of Sun microsystems the contents here are created as his own personal endeavor and thus does not reflect any official stance of Sun Microsystems on any particular technology 2
2 Disclaimer & Acknowledgments • Even though Sang Shin is a full-time employee of Sun Microsystems, the contents here are created as his own personal endeavor and thus does not reflect any official stance of Sun Microsystems on any particular technology
令Sn Agenda 1. What is Rich User Experience? 2. Rich Internet Application(RIA) Technologies 3. AJAX: Real-life examples& Usage cases 4. What is and why ajaX? 5. Technologies used in aJAX 6. Anatomy of AJAX operation 7. XmlHttp Request Methods& Properties 8. DOM APIs InnerHTML 9. AJAX Security 10. JavaScript debugging tools 11. Current issues and future 3
3 Agenda 1.What is Rich User Experience? 2.Rich Internet Application (RIA) Technologies 3.AJAX: Real-life examples & Usage cases 4.What is and Why AJAX? 5.Technologies used in AJAX 6.Anatomy of AJAX operation 7.XMLHttpRequest Methods & Properties 8.DOM APIs & InnerHTML 9.AJAX Security 10.JavaScript debugging tools 11.Current issues and Future
令Sn Topics Covered in Other Presentations AJAX Toolkits Frameworks json ( JavaScript Object Notation) Dojo Toolkit DWR Direct Web remoting) AJAX-enabled JSF Components Google Web Toolkit( GWT) iMaki Wicket and Shale(as ajaX-aware Web applicaion frameworks) Javascript Programming Best Practices 4
4 Topics Covered in Other Presentations • AJAX Toolkits & Frameworks • JSON (JavaScript Object Notation) • Dojo Toolkit • DWR (Direct Web Remoting) • AJAX-enabled JSF Components • Google Web Toolkit (GWT) • jMaki • Wicket and Shale (as AJAX-aware Web applicaion frameworks) • JavaScript Programming Best Practices
今S 1 Rich User Experience for Web Application
1. Rich User Experience for Web Application
令Sn Rich User Experience Take a look at a typical desktop application Spreadsheet app, etc. The program responses intuitively and quickly The program gives a user meaningful feedback's instant a cell in a spreadsheet changes color when you hover your mouse over it Icons light up as mouse hovers them Things happen naturally No need to click a button or a link to trigger an event
6 Rich User Experience • Take a look at a typical desktop application (Spreadsheet app, etc.) • The program responses intuitively and quickly • The program gives a user meaningful feedback's instantly > A cell in a spreadsheet changes color when you hover your mouse over it > Icons light up as mouse hovers them • Things happen naturally > No need to click a button or a link to trigger an event
令Sn Characteristics of Conventional Web Applications Click, wait and refresh"user interaction Page refreshes from the server needed for all events, data submissions, and navigation The user has to wait for the response Synchronous"request/response"communication model Page-driven Workflow is based on pages Page-navigation logic is determined by the server
7 Characteristics of Conventional Web Applications • “Click, wait, and refresh” user interaction • Page refreshes from the server needed for all events, data submissions, and navigation • The user has to wait for the response • Synchronous “request/response” communication model • Page-driven: Workflow is based on pages • Page-navigation logic is determined by the server
令Sn ssues of conventional Web Application Slow response Loss of operational context during refresh loss of information on the screen oSs of scrolled position No instant feedback's to user activities s a user has to wait for the next page These are the reasons why rich Internet application (RIA) technologies were born
8 Issues of Conventional Web Application • Slow response • Loss of operational context during refresh > Loss of information on the screen > Loss of scrolled position • No instant feedback's to user activities > A user has to wait for the next page These are the reasons why Rich Internet Application (RIA) technologies were born
今S 2 Rich Internet Application ( RIA) Technologies
2. Rich Internet Application (RIA) Technologies
令Sn Rich Internet Application(RIA Technologies ppl Macromedia flash Java Web start DHTML DHTML With hidden frame AJAX 10
10 Rich Internet Application (RIA) Technologies • Applet • Macromedia Flash • Java WebStart • DHTML • DHTML with Hidden IFrame • AJAX