google i/o state of ajax
DESCRIPTION
Ben and I gave a talk on the state of Ajax at Google I/O.TRANSCRIPT
![Page 1: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/1.jpg)
![Page 2: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/2.jpg)
State of Ajax
Dion Almaer, GoogleBen Galbraith, Mediabank
Founders, Ajaxian.com
![Page 3: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/3.jpg)
![Page 4: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/4.jpg)
![Page 5: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/5.jpg)
![Page 6: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/6.jpg)
![Page 7: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/7.jpg)
![Page 8: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/8.jpg)
![Page 9: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/9.jpg)
![Page 10: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/10.jpg)
![Page 11: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/11.jpg)
![Page 12: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/12.jpg)
![Page 13: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/13.jpg)
“Google Suggest and Google Maps are two
examples of a new approach to web applications that we at
Adaptive Path have been calling Ajax. The name is shorthand for Asynchronous JavaScript + XML, and it represents a fundamental
shift in what’s possible on the Web.”
Jesse James GarrettCo-founder, Adaptive Path
![Page 14: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/14.jpg)
“Google Suggest and Google Maps are two
examples of a new approach to web applications that we at
Adaptive Path have been calling Ajax. The name is shorthand for Asynchronous JavaScript + XML, and it represents a fundamental
shift in what’s possible on the Web.”
Jesse James GarrettCo-founder, Adaptive Path
Designer!
![Page 15: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/15.jpg)
![Page 16: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/16.jpg)
![Page 17: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/17.jpg)
Great User ExperienceGreat Developer Experience
![Page 18: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/18.jpg)
Great User ExperienceGreat Developer Experience
![Page 19: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/19.jpg)
![Page 20: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/20.jpg)
![Page 21: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/21.jpg)
![Page 22: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/22.jpg)
![Page 23: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/23.jpg)
![Page 24: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/24.jpg)
![Page 25: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/25.jpg)
![Page 26: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/26.jpg)
![Page 27: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/27.jpg)
![Page 28: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/28.jpg)
Jef RaskinNoted Usability Expert
The Humane Interface
“!e quality of any [so"ware] is ultimately determined by the quality of the interaction between one human and one system.”
![Page 29: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/29.jpg)
Jef RaskinNoted Usability Expert
The Humane Interface
“If a system’s one-on-one interaction with its human user is not pleasant and facile, the resulting de#ciency will poison the performance of the entire system, however #ne that system might be in its other aspects.
![Page 30: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/30.jpg)
User Interface
Visual Design
Interaction Design
![Page 31: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/31.jpg)
User Interface
Visual Design
Interaction Design
“Seductive user interfaces” are
vacuous distractions!
![Page 32: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/32.jpg)
User Interface
Visual Design
Interaction Design
“Seductive user interfaces” are
vacuous distractions!
HCI researchers are nerds!
![Page 33: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/33.jpg)
User Interface
Visual Design
Interaction Design
“Seductive user interfaces” are
vacuous distractions!
HCI researchers are nerds!
Emacs!
![Page 34: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/34.jpg)
User Interface
Visual Design
Interaction Design
“Seductive user interfaces” are
vacuous distractions!
HCI researchers are nerds!
Emacs!
vi!
![Page 35: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/35.jpg)
User Interface
Visual Design
Interaction Design
“Seductive user interfaces” are
vacuous distractions!
HCI researchers are nerds!
Emacs!
vi!Microsoft Rulez!
![Page 36: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/36.jpg)
User Interface
Visual Design
Interaction Design
“Seductive user interfaces” are
vacuous distractions!
HCI researchers are nerds!
Emacs!
vi!Microsoft Rulez!
Real programmers use C++
![Page 37: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/37.jpg)
![Page 38: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/38.jpg)
The Web didn’t used to be a beautiful place...
![Page 39: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/39.jpg)
![Page 40: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/40.jpg)
![Page 41: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/41.jpg)
![Page 42: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/42.jpg)
![Page 43: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/43.jpg)
Top Grossing Film of 1957 Top Grossing Film of 2007
![Page 44: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/44.jpg)
![Page 45: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/45.jpg)
![Page 46: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/46.jpg)
![Page 47: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/47.jpg)
![Page 48: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/48.jpg)
![Page 49: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/49.jpg)
CSS and Animations
dojo.query("#nav > .focusable").
attr("tabIndex", 0).
style("border", "1px solid transparent").
anim({
"borderColor": { start: "yellow",
end: "white" }
});
![Page 50: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/50.jpg)
![Page 51: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/51.jpg)
![Page 52: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/52.jpg)
![Page 53: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/53.jpg)
![Page 54: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/54.jpg)
![Page 55: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/55.jpg)
Jakob NielsenNoted Usability Expert
![Page 56: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/56.jpg)
Jakob NielsenNoted Usability Expert
“!e basic advice regarding response times has been about the same for thirty years:
![Page 57: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/57.jpg)
Jakob NielsenNoted Usability Expert
“0.1 second is about the limit for having the user feel that the system is reacting instantaneously, meaning that no special feedback is necessary except to display the result.
![Page 58: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/58.jpg)
Jakob NielsenNoted Usability Expert “1.0 second is about the limit for
the user's $ow of thought to stay uninterrupted, even though the user will notice the delay.
![Page 59: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/59.jpg)
Jakob NielsenNoted Usability Expert
“Normally, no special feedback is necessary during delays of more than 0.1 but less than 1.0 second, but the user does lose the feeling of operating directly on the data.”
![Page 60: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/60.jpg)
<script type="text/javascript">
function getCityByZip(zip) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
processResults(xhr);
}
xhr.open("GET", "/fun.endpoint?zip=" + zip);
xhr.send(null);
}
function processResults(xhr) {
if (xhr.readyState == 4) {
var parent = document.getElementById("cityParent");
parent.innerHTML = xhr.responseText;
}
}
</script>
![Page 61: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/61.jpg)
Easy Remoting
<script type="text/javascript">
function getCityByZip(zip) {
new Ajax.Request("/fun.endpoint?zip=" + zip, {
method: "get",
onSuccess: function(xhr) {
$("city").value = xhr.responseText;
}
});
}
</script>
![Page 62: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/62.jpg)
![Page 63: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/63.jpg)
XHR
![Page 64: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/64.jpg)
XHR
![Page 65: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/65.jpg)
![Page 66: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/66.jpg)
The Old Taxonomy
![Page 67: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/67.jpg)
The Old Taxonomy
PrototypeLightweight Ajax/JavaScript helpers
![Page 68: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/68.jpg)
The Old Taxonomy
PrototypeLightweight Ajax/JavaScript helpers
GWTHate JavaScript? No problem, use Java.
![Page 69: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/69.jpg)
The Old Taxonomy
PrototypeLightweight Ajax/JavaScript helpers
GWTHate JavaScript? No problem, use Java.
jQueryNew, DOM-centric JavaScript helper
![Page 70: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/70.jpg)
The Old Taxonomy
dojoYour Soup-to-Nuts Ajax/Javascript
Platform
PrototypeLightweight Ajax/JavaScript helpers
GWTHate JavaScript? No problem, use Java.
jQueryNew, DOM-centric JavaScript helper
![Page 71: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/71.jpg)
The New Taxonomy
![Page 72: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/72.jpg)
Prototype jQuery Dojo Core
The New Taxonomy
![Page 73: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/73.jpg)
Prototype jQuery Dojo Core
Plug-in Communityscripteka.com
Plug-in Communityplugins.jquery.com
Plug-in Communitydojox
The New Taxonomy
![Page 74: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/74.jpg)
Prototype jQuery Dojo Core
Plug-in Communityscripteka.com
Plug-in Communityplugins.jquery.com
Plug-in Communitydojox
Script.aculo.us jQuery UI dijit
The New Taxonomy
![Page 75: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/75.jpg)
DOM Goodness
$(document).bind("ready", function() {
$("div").bind("mousewheel", function(event, delta) {
if (delta < 0) {
$(this).append("up");
} else {
$(this).append("down");
}
);
});
![Page 76: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/76.jpg)
GWT Panels
String html = "<div id='one' "
+ "style='border:3px dotted blue;'>"
+ "</div><div id='two' "
+ "style='border:3px dotted green;'"
+ "></div>";
HTMLPanel panel = new HTMLPanel(html);
panel.setSize("200px", "120px");
panel.addStyleName("demo-panel");
panel.add(new Button("Do Nothing"), "one");
panel.add(new TextBox(), "two");
RootPanel.get("demo").add(panel);
![Page 77: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/77.jpg)
![Page 78: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/78.jpg)
Dojo Charting
![Page 79: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/79.jpg)
Dojo Charting
Dojo Grid
![Page 80: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/80.jpg)
Dojo Charting
Dojo Grid
Processing.js
![Page 81: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/81.jpg)
Jakob NielsenNoted Usability Expert
“0.1 second is about the limit for having the user feel that the system is reacting instantaneously, meaning that no special feedback is necessary except to display the result.
![Page 82: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/82.jpg)
Browser
![Page 83: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/83.jpg)
Operating System
Event Queue
Browser
![Page 84: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/84.jpg)
Operating System
Event Queue
Browser
![Page 85: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/85.jpg)
Operating System
Event Queue
Mouse Moved
Mouse Pressed
Mouse Released
Key Pressed
Key Released
Browser
![Page 86: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/86.jpg)
Operating System
Event Queue
Mouse Moved
Mouse Pressed
Mouse Released
Key Pressed
Key Released
Browser
![Page 87: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/87.jpg)
Operating System
Event Queue
Mouse Moved
Mouse Pressed
Mouse Released
Key Pressed
Key Released
Browser
![Page 88: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/88.jpg)
Operating System
Event Queue
Mouse Moved
Mouse Pressed
Mouse Released
Key Pressed
Key Released
JavaScript
Browser
![Page 89: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/89.jpg)
Operating System
Event Queue
Mouse Moved
Mouse Pressed
Mouse Released
Key Pressed
Key Released
JavaScript
Browser
![Page 90: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/90.jpg)
Operating System
Event Queue
Mouse Moved
Mouse Pressed
Mouse Released
Key Pressed
Key Released
JavaScript Web Browsing
Browser
![Page 91: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/91.jpg)
Operating System
Event Queue
Mouse Moved
Mouse Pressed
Mouse Released
Key Pressed
Key Released
JavaScript Web Browsing
Potential
Bottleneck
Browser
![Page 92: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/92.jpg)
User Interface
BackgroundThread
2
Browser
1
![Page 93: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/93.jpg)
User Interface
BackgroundThread
2X
Browser
1
![Page 94: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/94.jpg)
![Page 95: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/95.jpg)
Brendan EichInventor of JavaScript
CTO, Mozilla
Brendan’s Blog
![Page 96: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/96.jpg)
Brendan EichInventor of JavaScript
CTO, Mozilla
“!reads suck.”
Brendan’s Blog
![Page 97: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/97.jpg)
User Interface
BackgroundThread
2X
Browser
1
![Page 98: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/98.jpg)
User Interface
BackgroundThread
2
Browser
1
![Page 99: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/99.jpg)
User Interface
WorkerPool
Browser
1
WorkerPool
2 3
Message Passing
![Page 100: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/100.jpg)
Jef RaskinNoted Usability Expert
The Humane Interface
“If [a] feature is well–designed, and if we use it repeatedly, we eventually... use the feature habitually, without thought or conscious e%ort.
![Page 101: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/101.jpg)
Jef RaskinNoted Usability Expert
The Humane Interface
“In operating an interface we combine or ‘chunk’ sequences of actions into gestures, which, once started, proceed automatically. Because we form gestures, techniques such as having a user respond Y or N to an ‘Are you sure?’ veri#cation do not provide safety: !e typed ‘Y’ becomes part of the gesture.”
![Page 102: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/102.jpg)
Prefer Undo to Warning Dialogs
![Page 103: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/103.jpg)
Prefer Undo to Warning DialogsErr, how do you do that on the Web?
![Page 104: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/104.jpg)
Prefer Undo to Warning DialogsErr, how do you do that on the Web?
...and, uh, how do you handle transactions?
![Page 105: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/105.jpg)
Form History
![Page 106: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/106.jpg)
Some Business Form
First Name:
Last Name:
Address Line 1:
Address Line 2:
City:
State:
Zip:
Foo:
Gawuzzit:
Lugnutzwit:
Cookie Monster:
Some Value
Some Value
Some Value
Some Value
Some Value
Some Value
Some Value
Some Value
Some Value
Some Value
Some Value
Form History:
PresentPast
![Page 107: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/107.jpg)
Some Business Form
First Name:
Last Name:
Address Line 1:
Address Line 2:
City:
State:
Zip:
Foo:
Gawuzzit:
Lugnutzwit:
Cookie Monster:
Some Value
Some Value
Some Value
Some Value
Some Value
Some Value
Some Value
Some Value
Some Value
Some Value
Some Value
Form History:
Present2 weeks ago
Past
History Value Here
History Value Here
History Value Here
History Value Here
History Value Here
History Value Here
History Value Here
History Value Here
History Value Here
History Value Here
History Value Here
![Page 108: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/108.jpg)
Web Services
Your Application
![Page 109: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/109.jpg)
Web Services
Your Application
![Page 110: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/110.jpg)
Web Services
Your Application
![Page 111: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/111.jpg)
Web Services
Your Application
![Page 112: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/112.jpg)
Web Services
Your Application
![Page 113: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/113.jpg)
![Page 114: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/114.jpg)
Amazon EC2Elastic Compute Cloud
![Page 115: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/115.jpg)
Amazon EC2Elastic Compute Cloud
![Page 116: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/116.jpg)
Amazon EC2Elastic Compute Cloud
Google App Engine
![Page 117: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/117.jpg)
Amazon EC2Elastic Compute Cloud
Google App Engine
Aptana Cloud
![Page 118: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/118.jpg)
Macintosh HD
![Page 119: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/119.jpg)
Macintosh HD
“You just got another email from your wife!”
![Page 120: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/120.jpg)
Macintosh HD
“You just got another email from your wife!”
32
![Page 121: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/121.jpg)
Macintosh HD
“You just got another email from your wife!”
32
![Page 122: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/122.jpg)
Macintosh HD
“You just got another email from your wife!”
32
![Page 123: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/123.jpg)
Fluid
MozillaPrism
Adobe AIR
Gears
![Page 124: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/124.jpg)
Fluid
Gears
![Page 125: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/125.jpg)
Fluid
37signals’Campfire
![Page 126: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/126.jpg)
Fluid
37signals’Campfire
GreaseMonkey /GreaseKit
![Page 127: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/127.jpg)
XHR
![Page 128: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/128.jpg)
![Page 129: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/129.jpg)
![Page 130: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/130.jpg)
![Page 131: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/131.jpg)
![Page 132: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/132.jpg)
![Page 133: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/133.jpg)
wiiuse library
![Page 134: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/134.jpg)
wiiuse library
JNI
![Page 135: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/135.jpg)
wiiuse library
JNI
Java Plug-in
![Page 136: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/136.jpg)
wiiuse library
JNI
Java Plug-in
wiiusej
![Page 137: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/137.jpg)
wiiuse library
JNI
Java Plug-in
wiiusej
![Page 138: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/138.jpg)
wiiuse library
JNI
Java Plug-in
WiiTracker
wiiusej
![Page 139: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/139.jpg)
wiiuse library
JNI
Java Plug-in
WiiTracker
wiiusej
![Page 140: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/140.jpg)
wiiuse library
JNI
Java Plug-in
WiiTracker
wiiusej
WiiApplet
![Page 141: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/141.jpg)
wiiuse library
JNI
Java Plug-in
WiiTracker
wiiusej
WiiApplet
![Page 142: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/142.jpg)
wiiuse library
JNI
Java Plug-in
WiiTracker
Browser
wiiusej
WiiApplet
![Page 143: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/143.jpg)
wiiuse library
JNI
Java Plug-in
WiiTracker
Browser
JavaScript Dart Game
wiiusej
WiiApplet
![Page 144: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/144.jpg)
The New Java Plug-inBeta Shipping Today with Java 1.6 “Update 10”
1 Java plug-in now out-of-processNo more locking up the browser UI on launchApplets can persist across browser sessionsMore control over the Applet’s JVM
2 Improved Applet deploymentJavaScript-based “Deployment Toolkit”Mature JNLP-based Applet metadata
3 A smaller JDKMicro-kernel gives streamlined download option
![Page 145: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/145.jpg)
The Future?
![Page 146: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/146.jpg)
The Breakdown of Modern Web Development
![Page 147: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/147.jpg)
Safari CSS Animations
![Page 148: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/148.jpg)
Safari CSS Reflections and Masks
![Page 149: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/149.jpg)
Mozilla’s Monkeys?
![Page 150: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/150.jpg)
![Page 151: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/151.jpg)
![Page 152: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/152.jpg)
Updating the Web...
Gears
![Page 153: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/153.jpg)
HTML 5 Gears
• Standards• Long term• All browsers• No plugin
• Implementation• Battle hardened• A place for innovation• Cross browser• Plugin
Past
Present
Future
A bleeding edge version of HTML 5!
![Page 154: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/154.jpg)
Ajax
![Page 155: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/155.jpg)
Ajax
Easy Programming
Model
![Page 156: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/156.jpg)
Ajax
Easy Programming
Model
Easy Remoting
![Page 157: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/157.jpg)
Ajax
Easy Programming
Model
Easy Remoting
Extensive Customization
Vectors
![Page 158: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/158.jpg)
Ajax
Easy Programming
Model
Easy Remoting
Extensive Customization
Vectors
Easy Deployment
![Page 159: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/159.jpg)
Ajax
Easy Programming
Model
Easy Remoting
Extensive Customization
Vectors
Great Widgets
Easy Deployment
![Page 160: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/160.jpg)
Ajax
Easy Programming
Model
Easy Remoting
Extensive Customization
Vectors
Great Widgets
Easy Deployment
Great FX
![Page 161: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/161.jpg)
Ajax
Easy Programming
Model
Easy Remoting
Extensive Customization
Vectors
Great Widgets
Easy Deployment
Great Mobile Story
Great FX
![Page 162: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/162.jpg)
Ajax
Easy Programming
Model
Easy Remoting
Extensive Customization
Vectors
Great Widgets
Easy Deployment
Great Mobile Story
Desktop Integration
Great FX
![Page 163: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/163.jpg)
Ajax
Easy Programming
Model
Easy Remoting
Extensive Customization
Vectors
Great Widgets
Easy Deployment
Great Mobile Story
Desktop Integration
State-of-the-Art Plug-ins
Great FX
![Page 164: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/164.jpg)
![Page 165: Google I/O State Of Ajax](https://reader038.vdocument.in/reader038/viewer/2022102922/5480273fb4af9fb64b8b45af/html5/thumbnails/165.jpg)