An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec •...
Transcript of An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec •...
![Page 2: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/2.jpg)
These Slides Are Online:http://alex.dojotoolkit.org
Tarball Of Demo Code:http://alex.dojotoolkit.org/wp-content/demos.tar.gz
![Page 3: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/3.jpg)
Please Ask QuestionsOdds are someone else is wondering the same thing
![Page 4: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/4.jpg)
What We’ll Cover
• What Ajax is
• What Ajax is not
• The fundamentals of Ajax
• How to build better experiences with Ajax
• Tools to make Ajax development easier
![Page 5: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/5.jpg)
How We’ll Get There
• Demos
• Deconstruction
• Code examples
• Introduction to debugging tools
![Page 6: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/6.jpg)
What You’ll Walk Away With
• Enough code to be dangerous
• Enough knowledge not to be
• Tools of the trade
• Places to look when you get stuck
• How it all fits together
• The lowdown on “what’s next”
![Page 7: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/7.jpg)
What Is Ajax?
• New name, old tech
• Technique for increasing UI responsiveness
• Incremental, in-place updates to a page
• Updates a result of user actions
• Preserves you reach
• No plugins, standards based
• Browser as protocol participant
![Page 8: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/8.jpg)
Why Ajax Now?• The browsers stabalized
• The DOM is more-or-less implemented
• HTML and CSS are tapped out
• At the limit of resonsiveness and usability
• REST and SOAP are handy endpoints
• What if the browser could be just another client?
![Page 9: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/9.jpg)
When Is Ajax The Answer?
• When targeting majority browsers exclusively or can write two versions
• When you interface “feels” heavy
• When the competition is using Ajax
• They will be soon!
• When it can make users’ lives better but not worse
![Page 10: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/10.jpg)
When Is Ajax Bad?
• When it breaks the freaking back button
• When it hinders accessibility
• When it disorients users
• “jumping blocks”
• When it fails silently
• When it ignores indempotency
![Page 11: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/11.jpg)
Remember Your UsersAjax that doesn’t build better experiences is dumb
![Page 12: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/12.jpg)
Auto Save
![Page 13: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/13.jpg)
Grab the Chicken!
• Surprisingly intuitive experiences
• Demo Uses:
• Simple structural HTML elements
• Basic event handling
• Background REST requests
• Get out of the user’s way!
![Page 14: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/14.jpg)
Dissecting Auto Save
• XMLHTTP introduced
• browser incompatibilities papered over
• Return XML traversed to get data
• Basic DOM manipulation
• ~150 lines of procedural JavaScript
![Page 15: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/15.jpg)
var progIds = [ 'Msxml2.XMLHTTP', 'Microsoft.XMLHTTP', 'Msxml2.XMLHTTP.4.0']; var http = null; var last_e = null;
try{ http = new XMLHttpRequest(); }catch(e){}
// IE branch /*@cc_on @*/ /*@if (@_jscript_version >= 5) if(!http){ for(var i=0; i<progIds.length; ++i){ var objectType = progIds[i]; try{ http = new ActiveXObject(objectType); }catch(e){ last_e = e; } } } @end @*/
![Page 16: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/16.jpg)
Dissection contd.• Basic DOM manipulation
• Getting “handles” to nodes
• getElementsByTagName()
• getElementById()
• Creating elements - example
• Deleting elements - example
• Moving elements around - example
• Changing the look of things - example
![Page 17: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/17.jpg)
Scheduled Saves
• HTTP POST
• We’re modifying data
• setInterval() for occasional execution
• Events hard-wired to IDs
• This code is brittle and hard to reuse
![Page 18: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/18.jpg)
More on XMLHTTP• Sync or Async communication
• Simple callback scheme for status
• Can return either text or XML doc
• Uses one of 2 available sockets
• not x-domain
• Return order NOT guaranteed
• Interface NOT a standard (yet)
![Page 19: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/19.jpg)
Ajax “quirks”• Synchronous requests halt browser
• Picky about response Content-Type
• Some verbs problematic (HEAD, PUT)
• File upload not available cross-browser
• handled w/ iframes and form hacks
• Bugs:
• Caching (IE and FF 1.5 do, FF 1.0 doesn’t)
• IE: which MSXML did I really get?
![Page 20: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/20.jpg)
What About Iframes?
• Used extensively by earlier toolkits
• Highly portable (works on 4.0 browsers)
• IE “Phantom Click”
• onload handler not reliable
• Only way to upload files reliably
• Async only
![Page 21: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/21.jpg)
Design Decision:What To Send?
• XML
• plain/text
• HTML
• JavaScript (JSON)
![Page 22: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/22.jpg)
“It Depends”
• HTML
• Easy to insert into document (fast!)
• Can return as just a string, easy to debug
• Portability problems
• Implies replacement, not update
![Page 23: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/23.jpg)
contd.• XML
• Usually supported, MUST use “text/xml”
• Doesn’t tie your server to your rendering
• Need to transform on client
• XSLT can be very fast
• Very large on the wire
![Page 24: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/24.jpg)
contd.• Plain text
• JavaScript/JSON
• Smallest for large data sets
• Fastest parsing
• Native language of your scripting environment
• Constructing UI can be slower
• App more likely to “speak” XML
![Page 25: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/25.jpg)
Improving Auto Save
![Page 26: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/26.jpg)
Experience Improvements
• Only auto-save after things change
• Avoid “twitchyness”
• Smoother notification
• Handle unavailable network
• Save to cookie as backup
![Page 27: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/27.jpg)
Code Improvements
• Less browser quirk juggling
• Less brittle event/node linkage
• Animations for transitions
• A reusable auto-save component
• Easier to instantiate
![Page 28: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/28.jpg)
Toolkits To The Resuce!• Dojo:
• Save data with dojo.io.bind()
• Generic events with dojo.event.connect()
• Animation and component support
• Prototype:
• Save data with Ajax.Request
• Portable events with Event.observe()
![Page 29: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/29.jpg)
Other Quality Toolkits• Open Source
• MochiKit
• YUI
• Scriptaculous (builds on Prototype)
• Closed Source
• TurboWidgets (based on Dojo)
• Bindows
• Backbase
![Page 30: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/30.jpg)
Auto Save With Prototype
![Page 31: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/31.jpg)
Debugging: A Digression
![Page 32: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/32.jpg)
Basic Debugging Tools
• Your tenacity
• Standards references
• Mozilla, Safari, Opera JavaScript consoles
• IE Script Debugger
• Rhino or WSH for basic langauge problems
![Page 33: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/33.jpg)
Advanced Debugging Tools
• Firebug
• LiveHTTPHeaders
• Ethereal
• Venkman
• Microsoft Script Editor
• Squarefree JS shell bookmarklet
• Virtualization
• VNC/RDP/X11
• Fiddler proxy
• Web Developer Toolbar
• Firefox
• IE
![Page 34: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/34.jpg)
When In Doubt, Watch The Traffic
![Page 35: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/35.jpg)
85+% Of Your Users Still Use IE
![Page 36: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/36.jpg)
Auto Save With Dojo
![Page 37: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/37.jpg)
Making It A Component
• Auto-Save for any <textarea>
• Why widgets?
• Automatic property binding
• Modularization
• Easier to re-use
![Page 38: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/38.jpg)
Auto Save Dojo Widget
![Page 39: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/39.jpg)
JavaScript: A Digression
![Page 40: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/40.jpg)
It Works Now• Not a “toy” language
• Dynamic, functional (has closures)
• Classes and inheritance
• Ubiquitous: browser, stand alone, flash, etc.
• Debuggers available
• Can be modularized/packaged
• Libraries provide packaging, AOP, etc.
![Page 41: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/41.jpg)
The Chameleon Of Languages
• Never what you expect
• Whatever you make of it
• Imperative to imperative programmers
• OO (with quirks) to OO programmers
• Functional to Functional hackers
![Page 42: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/42.jpg)
Language Features• Lexical scope
• Functions are objects
• Functions are closures
• Anonymous function support
• Delegation via the prototype chain
• OOP via constructor closures and prototype inheritance
• Some interpreters support continuations
• C-style syntax
![Page 43: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/43.jpg)
OOP in JS
• Prototype-based inheritance
• Not class-based!
• Prototype chain is method and property delegation
![Page 44: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/44.jpg)
The Prototype Chainfunction FooClass(ctorArg1, ctorArg2){}
FooClass.prototype.foo = “foo”;FooClass.prototype.bar = “bar”;
var baz = new FooClass();baz.foo = “my own foo”;
var thud = new FooClass();thud.foo == “foo”;
![Page 45: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/45.jpg)
Mixins For Multiple Inheritance
// “interfaces that actually do something”namespace.mixinClass = function(){ this.foo = “foo”; this.bar = function(){ alert(this.foo); }};function thingerClass(){ namespace.mixinClass.call(this);}(new thingerClass()).foo == “foo”;
![Page 46: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/46.jpg)
Rant: The Open Web
![Page 47: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/47.jpg)
The Open Web Is Under Attack
![Page 48: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/48.jpg)
The Web Won Because It Cost Less To Build
• Markup is the fastest way to build UIs
• Text, end-to-end
• Remixable
• Open Specs allow multiple renderers
• Royalty-free licensing of IP a key tennant
![Page 49: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/49.jpg)
Who Wouldn’t Love To Control The Web?
• Now that it’s valuable, there’s money to be had
• Closed, markup-based systems with single renderers threaten our ability to build freely
![Page 50: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/50.jpg)
Ajax Is Helping To Keep The Web Open
• Still text all the way
• Open protocols: HTTP
• Standards-based tools, multiple clients
• Still not an experience that’s competitive with closed solutions
![Page 51: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/51.jpg)
Browser Vendors Do What You Demand
![Page 52: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/52.jpg)
Nothing More.Often Much Less.
![Page 53: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/53.jpg)
Make Your Voice Heard• Support minority browsers in your apps
• Use better browsers
• Vote for bugs in Open Source renderers
• File bugs for missing features in closed clients
• Blog
• Comment on vendor blogs
![Page 54: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/54.jpg)
The Open Web Can Still Win
![Page 55: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/55.jpg)
What’s Next
• Low-latency data transfer: “Comet”
• Continued JavaScript ubiquity
• Shipping with next JDK
• E4X
• Blurred desktop/web lines
• Cross-domain API usage from the browser
![Page 56: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/56.jpg)
Where To Look For Answers
• JavaScript, The Definitive Guide
• W3C DOM Spec
• Ecma 262-3 Spec
• Quirksmode.org
• MSDN DHTML References
• Mozilla DOM Reference
• Ajaxpatterns.org
• Toolkit-specific lists and forums
• javascript.faqts.com
• Browser source code
• Toolkit source code
![Page 58: An Introduction To Ajax - Infrequently Noted · Guide • W3C DOM Spec • Ecma 262-3 Spec • Quirksmode.org • MSDN DHTML References • Mozilla DOM Reference • Ajaxpatterns.org](https://reader031.fdocuments.us/reader031/viewer/2022012012/614296b5d9e4dc11f47f2529/html5/thumbnails/58.jpg)
Thanks For Showing Up!