html5: toolkits and gaps
DESCRIPTION
How Toolkits fill the gaps between marketing and reality of HTML5.TRANSCRIPT
© SitePen, Inc. All Rights Reserved
Toolkits and Gaps
Dylan Schiemann (@dylans)SitePen, Inc.HTML5 Code Camp, October, 2010
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Toolkit Goals
Fill gap, add features and enhancements
Experiment
Create clean APIs
Beyond HTML5
Better widgets, charts, higher level APIs
Allowed disagreement, on top of standards
Opportunities, constraints, and conflict:
Best toolkits make parts of themselves irrelevant over time
vapor.js
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Browsers and Recommendations
Are flawed
Have inconsistencies
Make invention possible, but trail behind
Which is why we have and need good toolkits
Iterate faster
Different styles and taste
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Dojo
Retrofitting itself for HTML5 support
Removing obsolete features as appropriate
Keeping compatibility and API consistency
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Dojo Toolkit: Project Goals
Fill the Browser Gaps
Fast & EfficientModular, Small Base, Extensible
Professional & Sophisticated
Powerful
Developer productivity and tools
Push the limits (vector graphics, offline, html5, etc.)
Open, free, & liberally licensed
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Toolkit Features
Packages, Builds, Timing
DOM Manipulation/Querying/Behavior
Events (DOM, function to function, pubsub)
Ajax (XHR, iframe, x-domain, form submits, polling, long-polling, and more) and Effects
DnD & a11y/i18n
Dijit (widget system, Layout, Form, WYSIWYG editor, Tree, Grid, many more)
Vector Graphics (gfx, charting, drawing, SVG/Canvas/VML/Flash/Silverlight/SVGWeb)
Data/JSON/REST/RPC
Offline, Local Storage (Gears, HTML5, Flash, Cookies, etc.)
Comet, XMPP, WebSocket
Developer Utilities (build, test, documentation)
Mobile
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Innovation
Standards
Dirty Hacks
Inspired by Andy Hume
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
CSS
<font>
<div>
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
dojo.query
getElementsByTagName
querySelectorAll
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Dojo 0.4
Dojo 0.1
netWindows
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Dojo 1.4
Dojo 1.0
Dojo 0.4
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Dojo 2.0
Dojo 1.5 & 1.6HTML5
Dojo 1.4
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
How?
Feature Detection
data attributes
sockets
GFX
Storage
Dijit
Mobile
...
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
3 Dojo Foundation Mobile Projects
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Most Experimental & Lean
http://winktoolkit.org/
WINK ToolkitCompletely separate code base
Innovative UI elements (3D useful for tight screen space
Started by Orange Labs
iPhone and Android apps, consistent look and feel, other platforms coming
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Most Complete
http://github.com/uxebu/embedjs/
EmbedJSDojo APIs, stripped down for mobile and embedded
Started by Uxebu
Target each platform with its native look & feel
TouchScroll, geolocation, etc.
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Most Stable for Dojo users
DojoX MobileStarted in Dojo 1.5
Fix things in Dojo that break for mobile, API stable
Merge features from EmbedJS, WINK Toolkit
Feature Detection
Support for many HTML5 features and beyond
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Sunday, October 17, 2010
© SitePen, Inc. All Rights Reserved
Q&A / Thanks
SitePen sitepen.com
Dojo Toolkit dojotoolkit.org
Dojo Foundation dojofoundation.org
Dijit dojotoolkit.org
Dojo Campus dojocampus.org
Twitter: @dylans @dojo @sitepen @cometdaily #dojo
Slide Share: http://www.slideshare.net/dylanks/
LinkedIn: http://www.linkedin.com/in/dylans/
Sunday, October 17, 2010