May 2008 - 1 - Investor Presentation May 2008 Air Arabia PJSC.
XTech May 2008
-
Upload
michaeltm-smith -
Category
Technology
-
view
2.570 -
download
3
Transcript of XTech May 2008
![Page 1: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/1.jpg)
Browserson the move
2007-05 to 2008-06
Michael(tm) Smith
![Page 2: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/2.jpg)
Prologue: Biggest browsermilestones of past 12 months?• 2007-06: iPhone released with Safari/
WebKit• 2008-03: IE8 beta released
![Page 3: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/3.jpg)
Outline• Part 1: Mobile-browser milestones• Part 2: CSS/DOM browser changes• Interlude: Web dev tools in browsers• Part 3: Cross-doc/site, offline apps,
local storage• Part 4: XSLT/XPath, SVG, ARIA
![Page 4: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/4.jpg)
• Part 5: Assorted other changes/updates• Part 6: WebKit CSS innovations• Part 7: The year ahead
![Page 5: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/5.jpg)
Part 1: Mobile-browser news• iPhone Safari/WebKit• Opera Mini 4 (and for Android)• Opera Mobile• Mozilla Fennec• WebKit on Android, Qt, Windows
Mobile, S60
![Page 6: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/6.jpg)
iPhone Safari/WebKit browser
![Page 7: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/7.jpg)
iPhone Safari/WebKit browser• Essentially same WebKit engine as
desktop OSX Safari browser• Web standards support: CSS, DOM
scripting, XHR, etc.• NEW: Squirrelfish, Safari 4 (2008-06)
![Page 8: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/8.jpg)
Squirrelfish
![Page 9: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/9.jpg)
Squirrelfish (2008-06)• 1.6 times faster than Safari 3.1 JS
interpreter• 1.8 times faster than Tamarin (Adobe/
Mozilla2 JS interpreter)
![Page 10: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/10.jpg)
• Has potential to significantly speed upWeb-application performance oniPhone
![Page 11: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/11.jpg)
Opera Mini 4 released (2007-11)• same engine as Opera 9.5• Adds support for table, ol, ul,
heading levels, more
![Page 12: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/12.jpg)
Opera Mini 4 standards support• Improved JavaScript support (see
dev.opera.com articles)• “Vastly improved” CSS support,
including CSS3 selectors, mediaqueries, text-shadow, more
![Page 13: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/13.jpg)
Opera Mini “ported” to Android• Relies on MicroEmulator J2ME
implementation• Translates J2ME/MIDP API calls in
Android calls (essentially Java SEcalls)
![Page 14: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/14.jpg)
Opera Mini in the millions andbillions…• now 35 million Mini users• browsing 1.7 billion pages/month
![Page 15: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/15.jpg)
…Opera Mobile in millions too• Opera Mobile preinstalled on 100+
million phones• Only ~25 other companies in “100
million club” (with products preinstalled100+ million phones
• see visionmobile.com report
![Page 16: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/16.jpg)
Mozilla “Fennec” mobile
• 2008-04: “pre-alpha” build released• 2008-08: target for “A1” first full alpha
![Page 17: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/17.jpg)
Fennec goals• competitive performance• support for XUL/extensions• genuine integration with device
features• touchscreen UI and zoom
![Page 18: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/18.jpg)
Fennec platforms• current priority: Linux (ARM and x86)• 6 times faster than Moz MicroB on
(ARM-based Linux) Nokia 810• also plans for Windows Mobile
![Page 19: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/19.jpg)
Fennec: more info• drop by #mobile on irc.mozilla.org
![Page 20: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/20.jpg)
WebKit everywhere…
![Page 21: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/21.jpg)
Google Android & WebKit(2007-11)• WebKit is “rendering core for Android’s
browser”• Android APIs enable developer to use
WebKit engine in their custom apps
![Page 22: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/22.jpg)
Trolltech Qt & WebKit (2008-02)• WebKit is now a core component of Qt
4.4+ framework• Enables developer to use WebKit
engine in their custom Qt apps• Trolltech acquired by Nokia
![Page 23: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/23.jpg)
Nokia S60 WebKit port• no public checkins since 2007-08• Nokia rumored to be working on
updated port based on Safari3.1-based WebKit code
![Page 24: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/24.jpg)
WebKit on Windows Mobile• 2008-02: Iris browser (Torch Mobile
— George Staikos, of core WebKit Qtdev team)
• 2007-07: Wake3 (Dan Zucker, formerAccess)
![Page 25: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/25.jpg)
Part 2: CSS/DOM changes/surprises of interest to Webdevelopers• CSS & unknown elements in IE• native getElementsByClassName• CSS3 Selectors• Selectors API
![Page 26: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/26.jpg)
CSS & unknown elements in IE• Problem: IE won’t apply CSS to
unknown element fu• Solution: document.createElement("fu")• discovered by Sjoerd Visscher (see
his blog or John Resig blog for details)
![Page 27: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/27.jpg)
native getElementsByClassName• began in JS libraries, now in HTML5• now supported in Mozilla, WebKit/Safari
3+, Opera 9.5• no native support in IE yet
![Page 28: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/28.jpg)
CSS3 Selectors• Opera 9.5 and Safari 3.1/WebKit
(thanks to KHTML devs) pass all 43css3.info tests
• Mozilla/Minefield passes 36 of 43
![Page 29: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/29.jpg)
• NEW: mozilla-central now has nearlycomplete CSS3 Selectors support(2008-06)
• IE8 passes only 14 of 43
![Page 30: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/30.jpg)
Selectors API• querySelector & querySelectorAll
methods• API for scripting DOM traversal using
CSS3 Selectors• supported in WebKit & IE8
![Page 31: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/31.jpg)
Interlude: Web-developer toolsin browsers• Firebug for Mozilla• new tools in IE8• WebKit Web Inspector l& Drosera• Opera Dragonfly
![Page 32: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/32.jpg)
Firebug for Mozilla• no big changes?• same great tool as always• the standard by which all web-dev
tools in other browsers are judged
![Page 33: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/33.jpg)
new tools in IE8• DOM inspector• set of CSS/layout tools• script debugger
![Page 34: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/34.jpg)
WebKit Web Inspector andDrosera• Web Inspector: many improvements/
feature additions• Drosera (script debugger) with WebKit
nightlies
![Page 35: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/35.jpg)
• NEW: JS debugger now built into WebInspector (2008-06)
![Page 36: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/36.jpg)
Opera Dragonfly (2008-05-06)• DOM, CSS inspectors• script debugger• remote debugging (inspired by
Fiddler?)
![Page 37: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/37.jpg)
Dragonfly remote debugging
“Debug your phone or TV”
![Page 38: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/38.jpg)
Dragonfly architecture
“Scope” protocol & API
![Page 39: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/39.jpg)
Part 3: Cross-doc/site and localstorage• cross-document messaging• cross-site requests• offline apps• client-side persistent storage (name/
value pairs)
![Page 40: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/40.jpg)
• client-side SQL database API
![Page 41: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/41.jpg)
Cross-document messaging• HTML5 postMessage method• Implemented in IE8, Opera, WebKit,
Mozilla• can use with iframe as primitive for
cross-site requests
![Page 42: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/42.jpg)
Proposals: cross-site requests• W3C Access-Control spec• JSONRequest• Microsoft XDomainRequest (XDR)
![Page 43: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/43.jpg)
Status: cross-site requests• W3C Access Control implemented in
Mozilla but backed out from FF3for still-unclear reasons
• Microsoft XDR surprise release in IE8• JSONRequest: no signs of any browser
vendors interested in implementing
![Page 44: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/44.jpg)
Offline Web applications• ApplicationCache API• each app maintains its own manifest
and cache• implemented in Mozilla/Firefox 3• work in progress for WebKit
![Page 45: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/45.jpg)
HTML5 Client-side persistentstorage (name/value pairs)• Storage interface, sessionStorage &
localStorage attributes• enables offline apps, more• in Mozilla and IE8• work in progress for WebKit
![Page 46: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/46.jpg)
Client-side SQL database API• Gears-like, spec’ed in HTML5• Implemented in Webkit• Demo at http://webkit.org/misc/
DatabaseExample.html
![Page 47: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/47.jpg)
Part 4: XSLT/XPath, SVG, ARIA• XSLT with document() & node-set()• SVG in Opera, Mozilla, WebKit• ARIA in IE8, Opera, Mozilla
![Page 48: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/48.jpg)
client-side XSLT/XPath• Opera added support for document()• WebKit joins Opera, IE in
supporting node-set()• we now have scripted XSLT/XPath —
XSLTProcessor, DOMParser|loadXML,
![Page 49: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/49.jpg)
XMLSerializer — in all four majorbrowser engines
![Page 50: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/50.jpg)
SVG• Opera support remains strong• WebKit SVG support greatly improved;
recent big changes to enableSMIL-based SVG animations
• Mozilla support remains good
![Page 51: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/51.jpg)
ARIA• mechanism for making Web apps
usable with screen readers• used in Google Reader (2008-03)• supported in Mozilla, Opera, and IE8• work in progress for WebKit
![Page 52: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/52.jpg)
Part 6: Assorted other changes• HTML5 registerProtocolHandler()• JavaScript Getters and Setters• <video> element• IE8 <meta> versioning switch• Acid2 and Acid3
![Page 53: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/53.jpg)
HTML5 registerProtocolHandler()• enables a Web app to register as
handler for particular protocol/scheme• example: Web-based mail app
registers as a handler for mailto:• implemented in Firefox 3 (2008-04)
![Page 54: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/54.jpg)
JavaScript Getters and Setters• enable data-field encapsulation• in Mozilla, Safari 3, & Opera 9.5 betas• not supported in IE8 yet
![Page 55: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/55.jpg)
HTML5 <video> element• <video src="foo.ogg" id="foo_video">• Extensive scripting API for loading and
playing
![Page 56: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/56.jpg)
Simple <video> example
![Page 57: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/57.jpg)
Browser support for <video>• Safari 3.1 and WebKit nightlies• Mozilla/Firefox trunk build + patch for
bug 382267• Opera experimental build• no IE support yet
![Page 58: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/58.jpg)
The <video> problem• No royalty-free codec = no portable
video• Opera and Mozilla have support for
Ogg Theora, Safari and IE don’t (andwon’t)
![Page 59: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/59.jpg)
A <video> solution?• H.261-based Sun OMS video could be
possible solution: see http://xrl.us/omsvideo
• But it’s unclear howfeature-competitive the proposed OMScodec would be
![Page 60: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/60.jpg)
IE8 <meta> versioning switch• <meta http-equiv="X-UA-Compatible"
content="IE=7"/>• switches which rendering engine IE8
uses• defaults to IE8 if not specified
![Page 61: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/61.jpg)
Acid2 and IE8• IE8 passes the Acid2 test
• Safari, Mozilla, Opera passed long ago
![Page 62: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/62.jpg)
Acid3 and IE8
![Page 63: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/63.jpg)
Acid3 reference rendering
![Page 64: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/64.jpg)
Acid3 in other browsers• WebKit nightly: 100/100• Opera dev build: 100/100• Opera 9.5: 78/100• Safari 3.1: 75/100• Firefox 3/Minefield: 71/100
![Page 65: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/65.jpg)
Part 6: WebKit CSS innovations• Reflections: -webkit-box-reflect• Alpha masks: -webkit-mask• Canvas images: -webkit-canvas• Gradients: -webkit-gradient• Transitions: -webkit-transition• Transforms: -webkit-transform
![Page 66: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/66.jpg)
Part 7: The year ahead• updated browsers/engines on mobile• Google Summer of Code dividends• further CSS innovation• further HTML5 implementations• your predictions?
![Page 67: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/67.jpg)
Web browsers/engines onmobile devices• Opera Mobile 9.5• Android and Qt devices ship with
WebKit browsers?• updated Safari for iPhone, updated
S60 browser
![Page 68: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/68.jpg)
Google Summer of Code:WebKit projects• SVG filters• Web Forms 2.0• XBL2
![Page 69: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/69.jpg)
Further CSS innovation• WebKit @keyframes, -webkit-animation• WebKit CSS standardized?• other browsers pick up WebKit CSS?
![Page 70: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/70.jpg)
Further HTML5 implementations• more sessionStorage implementation• client-side SQL database• offline Web apps (App. Cache API)• embed non-visible data using data-*
attrs & dataset DOM attr
![Page 71: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/71.jpg)
Questions? Comments?
Your predictions for theyear ahead?
![Page 72: XTech May 2008](https://reader036.fdocuments.net/reader036/viewer/2022081400/55514ffcb4c905c6268b5545/html5/thumbnails/72.jpg)
These slides
http://w3.org/2008/Talks/05-07-smith-xtech/
slides.pdf