Your SlideShare is downloading. ×
Dojo & HTML5
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Dojo & HTML5

8,533
views

Published on

Dojo has Video and Audio and GFX, so it must be HTML5 compliant, no? Not so fast! We'll look over some core pieces and grade Dojo on how well it holds up!

Dojo has Video and Audio and GFX, so it must be HTML5 compliant, no? Not so fast! We'll look over some core pieces and grade Dojo on how well it holds up!

Published in: Technology, Design

1 Comment
1 Like
Statistics
Notes
  • can't download?why?
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
8,533
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
128
Comments
1
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Transcript

    • 1. Dojo & HTML5By Mike WilcoxSeptember, 2011
    • 2. Mike W ilcox
    • 3. Mike W ilcox
    • 4. Mike W ilcox AJAX CSS3 AIR AS3 HTML5 PHP MySQL DojoFlash Video
    • 5. Mike W ilcox Co m mitter! AJAX CSS3 AIR AS3 HTML5 PHP MySQL DojoFlash Video
    • 6. Mike W ilcox Co m mitter! AJAX CSS3 AIR AS3 HTML5 PHP MySQL DojoFlash Video Works there as Director of Technology.
    • 7. Mike W ilcox Co m mitter! Natch! AJAX CSS3 AIR AS3 HTML5 PHP MySQL DojoFlash Video Works there as Director of Technology.
    • 8. Mike W ilcox Co m mitter! Natch! @clubajax AJAX CSS3 AIR AS3 HTML5 PHP MySQL DojoFlash Video ITweet! Works there as Director of Technology.
    • 9. Is Dojo HTML5 Ready?
    • 10. Is Dojo HTML5 Ready?
    • 11. Is Dojo HTML5 Ready?
    • 12. Is Dojo HTML5 Ready? HTML5 makes a developer’s job easier by specifying uniform APIs across browsers and suggest new and more powerful features
    • 13. Is Dojo HTML5 Ready? HTML5 makes a developer’s job easier by specifying uniform APIs across browsers and suggest new and more powerful features library
    • 14. Is Dojo HTML5 Ready? HTML5 makes a developer’s job easier by specifying uniform APIs across browsers and suggest new and more powerful features library
    • 15. Is Dojo HTML5 Ready? HTML5 makes a developer’s job easier by specifying uniform APIs across browsers and suggest new and more powerful features Pre-written JavaScript designed to make coding library easier for devs
    • 16. Is Dojo HTML5 Ready? HTML5 makes a developer’s job easier by specifying uniform APIs across browsers and suggest new and more powerful features Pre-written JavaScript designed to make coding library easier for devs
    • 17. Is Dojo HTML5 Ready? HTML5 makes a developer’s job easier by specifying uniform APIs across browsers and suggest new and more powerful features Pre-written JavaScript designed to make coding library easier for devs
    • 18. Is Dojo HTML5 Ready? HTML5 makes a developer’s job easier by specifying uniform APIs across browsers and suggest new and more powerful features Pre-written JavaScript designed to make coding library easier for devs Pete is the president.
    • 19. The Top HTML5 Features
    • 20. The Top HTML5 Features1. Semantic Elements2.Forms3.Canvas / SVG4.WebGL / Canvas 3D5.Web Workers6.Geolocation7.Storage / Offline8.WebSockets9.Web Audio API10.CSS3 / WOFF11.Audio12.Video
    • 21. The Top HTML5 Features1. Semantic Elements2.Forms3.Canvas / SVG4.WebGL / Canvas 3D5.Web Workers6.Geolocation7.Storage / Offline8.WebSockets9.Web Audio API10.CSS3 / WOFF11.Audio12.Video
    • 22. Semantic Elements
    • 23. Semantic Elements Don’t be anti- semantic!
    • 24. Semantic Elements
    • 25. Semantic Elements
    • 26. Semantic Elements Fun new tag names, like: section, header, footer, menu, etc.
    • 27. Semantic Elements Fun new tag names, like: section, header, footer, menu, etc. Allows for nested hgroups, multiple h1 tags in a page
    • 28. Semantic Elements Fun new tag names, like: section, header, footer, menu, etc. Allows for nested hgroups, multiple h1 tags in a page Crawlers have less trouble determining your markup intent
    • 29. Semantic Elements Fun new tag names, like: section, header, footer, menu, etc. Allows for nested hgroups, multiple h1 tags in a page Crawlers have less trouble determining your markup intent Pretty much the first thing people think of... since it’s actually HTML
    • 30. Semantic Elements Fun new tag names, like: section, header, footer, menu, etc. Allows for nested hgroups, multiple h1 tags in a page Crawlers have less trouble determining your markup intent Pretty much the first thing people think of... since it’s actually HTML
    • 31. Semantic Elements Fun new tag names, like: section, header, footer, menu, etc. Allows for nested hgroups, multiple h1 tags in a page Crawlers have less trouble determining your markup intent Pretty much the first thing people think of... since it’s actually HTML Surprisingly not very well adopted considering XForms was introduced in 2003.
    • 32. Semantic Elements
    • 33. Semantic Elements Experiment: Dijit BorderContainer, in markup with HTML5 tags
    • 34. Semantic Elements
    • 35. Semantic Elements
    • 36. Semantic Elements Works in Firefox! Yay!
    • 37. Semantic Elements Works in Firefox! Yay! IE8... Not so much.
    • 38. Semantic Elements Works in Firefox! Yay! IE8... Not so much.
    • 39. Semantic Elements
    • 40. Semantic Elements Experiment: Simple custom widget. Minimal HTML5 tags.
    • 41. Semantic Elements Experiment: Simple custom widget. Minimal HTML5 tags.Keepin’ it simple!
    • 42. Semantic Elements Experiment: Simple custom widget. Minimal HTML5 tags.Keepin’ it simple!
    • 43. Semantic Elements Experiment: Simple custom widget. Minimal HTML5 tags.Keepin’ it simple!
    • 44. Semantic Elements
    • 45. D -Semantic Elements
    • 46. D - Semantic ElementsPros:
    • 47. D - Semantic ElementsPros: Parser handles some parent tags in the page body
    • 48. D - Semantic ElementsPros: Parser handles some parent tags in the page body There *is* a ticket for this in Trac.
    • 49. D - Semantic ElementsPros: Parser handles some parent tags in the page body There *is* a ticket for this in Trac.Cons:
    • 50. D - Semantic ElementsPros: Parser handles some parent tags in the page body There *is* a ticket for this in Trac.Cons: Right now, it blows up.
    • 51. Forms
    • 52. Forms
    • 53. Forms
    • 54. Forms
    • 55. Forms Placeholder text, validation, input widgets, uploaders, etc.
    • 56. Forms Placeholder text, validation, input widgets, uploaders, etc. The second thing people think of for HTML5!
    • 57. Forms Placeholder text, validation, input widgets, uploaders, etc. The second thing people think of for HTML5!
    • 58. Forms Placeholder text, validation, input widgets, uploaders, etc. The second thing people think of for HTML5! Surprisingly not very well adopted considering XForms was introduced in 2003.
    • 59. FormsThe following screenshots are an example of an HTML5forms sub-set. http://www.miketaylr.com/code/html5-forms-ui-support.html
    • 60. FormsNote the difference between Macand Windows... on the same browser.
    • 61. Forms Toggle th ese two sli des bacNote the difference between Mac k an d forth!and Windows... on the same browser.
    • 62. FormsWell, Firefox always seems to lag a little behind...
    • 63. FormsThe mighty Chrome! Hasn’t done a lot here...
    • 64. FormsNor Safari....
    • 65. FormsHey! I thought IE9 was 99% HTML5 compliant! They saidthey were.
    • 66. Dijit FormsDijit Forms Theme Tester in IE8 on Windows
    • 67. Dijit FormsDijit Forms Theme Tester in Firefox on Mac OSX 10
    • 68. Dijit FormsDijit Forms Theme Tester in Firefox on Mac OSX 10 Toggle th ese two sli des bac k an d for th!
    • 69. DojoX Uploader
    • 70. DojoX Uploader
    • 71. DojoX Uploader
    • 72. DojoX Uploader The Uploader successfully handles custom uploading cross browser with a standard, HTML5-friendly API.
    • 73. DojoX Uploader The Uploader successfully handles custom uploading cross browser with a standard, HTML5-friendly API. I wrote it! E ven supp orts Drag a n d Dro p!
    • 74. DojoX Uploader The Uploader successfully handles custom uploading cross browser with a standard, HTML5-friendly API. I wrote it! E ven supp orts Drag a n d Dro p!
    • 75. DojoX Uploader The Uploader successfully handles custom uploading cross browser with a standard, HTML5-friendly API. I wrote it! Too complicated. Dev users are asking the same questions over and over. Advanced is default. E ven supp orts Drag a n d Dro p!
    • 76. Forms
    • 77. AForms
    • 78. Pros: A Forms
    • 79. Pros: A Forms Pretty much has has the HTML5 Forms spec covered for years
    • 80. Pros: A Forms Pretty much has has the HTML5 Forms spec covered for years Consistent look cross browser (better than HTML5!)
    • 81. Pros: A Forms Pretty much has has the HTML5 Forms spec covered for years Consistent look cross browser (better than HTML5!) dataset & data-* attributes: data-dojo-type
    • 82. Pros: A Forms Pretty much has has the HTML5 Forms spec covered for years Consistent look cross browser (better than HTML5!) dataset & data-* attributes: data-dojo-typeCons:
    • 83. Pros: A Forms Pretty much has has the HTML5 Forms spec covered for years Consistent look cross browser (better than HTML5!) dataset & data-* attributes: data-dojo-typeCons: Compliance may not be quite 100%
    • 84. Pros: A Forms Pretty much has has the HTML5 Forms spec covered for years Consistent look cross browser (better than HTML5!) dataset & data-* attributes: data-dojo-typeCons: Compliance may not be quite 100% No Getters and Setters - custom API
    • 85. Canvas / SVG
    • 86. Canvas / SVG
    • 87. Canvas / SVG
    • 88. Canvas / SVG
    • 89. Canvas / SVG Canvas / Raster: Grid of pixels
    • 90. Canvas / SVG Canvas / Raster: Grid of pixels SVG / Vector: Mathematical representation of a shape
    • 91. Canvas / SVG Canvas / Raster: Grid of pixels SVG / Vector: Mathematical representation of a shape
    • 92. Canvas / SVG Canvas / Raster: Grid of pixels SVG / Vector: Mathematical representation of a shape Not in old-ass™ IE!
    • 93. Canvas / SVG Canvas / Raster: Grid of pixels SVG / Vector: Mathematical representation of a shape Not in old-ass™ IE! Fun security restriction surprises!
    • 94. DojoX GFX
    • 95. DojoX GFX meow!
    • 96. DojoX GFXdojox.gfx (GFX) is a cross-platform vector graphics APIthat loosely follows SVG as the underlying model. Itdetects the best graphics engine implementation foryour browser and uses that to render the graphics. meow!
    • 97. DojoX GFXdojox.gfx (GFX) is a cross-platform vector graphics APIthat loosely follows SVG as the underlying model. Itdetects the best graphics engine implementation foryour browser and uses that to render the graphics. meow!dojox.gfx Normalized API SVG VML Render Canvas Silverlight
    • 98. Canvas / SVG
    • 99. A +Canvas / SVG
    • 100. APros: + Canvas / SVG
    • 101. APros: + Canvas / SVG API works with Canvas, SVG, Silverlight and VML
    • 102. APros: + Canvas / SVG API works with Canvas, SVG, Silverlight and VMLCons:
    • 103. APros: + Canvas / SVG API works with Canvas, SVG, Silverlight and VMLCons: Close, but API is non-standard
    • 104. WebGL / Canvas 3D
    • 105. WebGL / Canvas 3D
    • 106. WebGL / Canvas 3D
    • 107. WebGL / Canvas 3D WebGL is a cross-platform API used to create 3D graphics in a browser. Because it runs in the HTML5 Canvas element, WebGL has full integration with all Document Object Model (DOM) interfaces.
    • 108. WebGL / Canvas 3D WebGL is a cross-platform API used to create 3D graphics in a browser. Because it runs in the HTML5 Canvas element, WebGL has full integration with all Document Object Model (DOM) interfaces. Ma de by the se guys!
    • 109. WebGL / Canvas 3D WebGL is a cross-platform API used to create 3D graphics in a browser. Because it runs in the HTML5 Canvas element, WebGL has full integration with all Document Object Model (DOM) interfaces. Because you can make stuff like this! Ma de by the se guys!
    • 110. Because thecode looks likethat!
    • 111. function init(){ // Initialize var gl = initWebGL("example", "vshader", "fshader", [ "vNormal", "vColor", "vPosition"], [ 0, 0, 0, 1 ], 10000);  // Set some uniform variables for the shaders gl.uniform3f(gl.getUniformLocation(gl.program, "lightDir"), 0, 0, 1); gl.uniform1i(gl.getUniformLocation(gl.program, "sampler2d"), 0); Because the  // Create a box. On return gl contains a box property with // the BufferObjects containing the arrays for vertices, // normals, texture coords, and indices. gl.box = makeBox(gl); code looks like that!  // Load an image to use. Returns a WebGLTexture object spiritTexture = loadImageTexture(gl, "resources/spirit.jpg");  // Create some matrices to use later and save their locations in the shaders gl.mvMatrix = new CanvasMatrix4(); gl.u_normalMatrixLoc = gl.getUniformLocation(gl.program, "u_normalMatrix"); gl.normalMatrix = new CanvasMatrix4(); gl.u_modelViewProjMatrixLoc = gl.getUniformLocation(gl.program, "u_modelViewProjMatrix"); gl.mvpMatrix = new CanvasMatrix4();  // Enable all of the vertex attribute arrays. gl.enableVertexAttribArray(0); gl.enableVertexAttribArray(1); gl.enableVertexAttribArray(2);  // Set up all the vertex attributes for vertices, normals and texCoords gl.bindBuffer(gl.ARRAY_BUFFER, gl.box.vertexObject); gl.vertexAttribPointer(2, 3, gl.FLOAT, false, 0, 0);  gl.bindBuffer(gl.ARRAY_BUFFER, gl.box.normalObject); gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0);  gl.bindBuffer(gl.ARRAY_BUFFER, gl.box.texCoordObject); gl.vertexAttribPointer(1, 2, gl.FLOAT, false, 0, 0);  // Bind the index array gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, gl.box.indexObject);  return gl;}
    • 112. WebGL / Canvas 3D
    • 113. Pa ssWebGL / Canvas 3D
    • 114. Pa ss WebGL / Canvas 3DPros:
    • 115. Pa ss WebGL / Canvas 3DPros: Existing libraries: C3DL, CopperLicht , EnergizeGL, GammaJS, GLGE, GTW, O3D, OSG.JS, SceneJS, SpiderGL, TDL, Three.js and X3DOM
    • 116. Pa ss WebGL / Canvas 3DPros: Existing libraries: C3DL, CopperLicht , EnergizeGL, GammaJS, GLGE, GTW, O3D, OSG.JS, SceneJS, SpiderGL, TDL, Three.js and X3DOMCons:
    • 117. Pa ss WebGL / Canvas 3DPros: Existing libraries: C3DL, CopperLicht , EnergizeGL, GammaJS, GLGE, GTW, O3D, OSG.JS, SceneJS, SpiderGL, TDL, Three.js and X3DOMCons: There is a DojoX 3Dgfx, but it’s not WebGL.
    • 118. Web Workers
    • 119. Web Workers
    • 120. Web Workers
    • 121. Web Workers
    • 122. Web Workers Multithreaded JavaScript?? What’s not cool about that!
    • 123. Web Workers Multithreaded JavaScript?? What’s not cool about that!
    • 124. Web Workers Multithreaded JavaScript?? What’s not cool about that! Damn you old-ass™ IE!! Workers can’t access the DOM. Can you picture some devs trying to use threads? Yikes!
    • 125. Web Workershttp://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers
    • 126. Web WorkersPossibilities:http://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers
    • 127. Web WorkersPossibilities: Prefetching and/or caching data for later use Code syntax highlighting or other real-time text formattinghttp://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers
    • 128. Web WorkersPossibilities: Prefetching and/or caching data for later use Code syntax highlighting or other real-time text formatting Spell checkerhttp://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers
    • 129. Web WorkersPossibilities: Prefetching and/or caching data for later use Code syntax highlighting or other real-time text formatting Spell checker Analyzing video or audio datahttp://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers
    • 130. Web WorkersPossibilities: Prefetching and/or caching data for later use Code syntax highlighting or other real-time text formatting Spell checker Analyzing video or audio data Background I/O or polling of webserviceshttp://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers
    • 131. Web WorkersPossibilities: Prefetching and/or caching data for later use Code syntax highlighting or other real-time text formatting Spell checker Analyzing video or audio data Background I/O or polling of webservices Processing large arrays or humungous JSON responseshttp://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers
    • 132. Web WorkersPossibilities: Prefetching and/or caching data for later use Code syntax highlighting or other real-time text formatting Spell checker Analyzing video or audio data Background I/O or polling of webservices Processing large arrays or humungous JSON responses Image filtering in <canvas>http://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers
    • 133. Web WorkersPossibilities: Prefetching and/or caching data for later use Code syntax highlighting or other real-time text formatting Spell checker Analyzing video or audio data Background I/O or polling of webservices Processing large arrays or humungous JSON responses Image filtering in <canvas> Updating many rows of a local web databasehttp://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers
    • 134. Web Workers
    • 135. Web Workers pros:
    • 136. Web Workers pros: Could be used with gfx3d, Data Stores, Charts, THE GRID, and crypto (which does utilize Gears Workers)
    • 137. Web Workers pros: Could be used with gfx3d, Data Stores, Charts, THE GRID, and crypto (which does utilize Gears Workers) IE10 will use messaging between workers - interesting possibilities
    • 138. Web Workers pros: Could be used with gfx3d, Data Stores, Charts, THE GRID, and crypto (which does utilize Gears Workers) IE10 will use messaging between workers - interesting possibilities Safari has child Workers
    • 139. Web Workers pros: Could be used with gfx3d, Data Stores, Charts, THE GRID, and crypto (which does utilize Gears Workers) IE10 will use messaging between workers - interesting possibilities Safari has child Workers cons:
    • 140. Web Workers pros: Could be used with gfx3d, Data Stores, Charts, THE GRID, and crypto (which does utilize Gears Workers) IE10 will use messaging between workers - interesting possibilities Safari has child Workers cons: Modern JavaScript performance has minimized the need for Workers
    • 141. Web Workers pros: Could be used with gfx3d, Data Stores, Charts, THE GRID, and crypto (which does utilize Gears Workers) IE10 will use messaging between workers - interesting possibilities Safari has child Workers cons: Modern JavaScript performance has minimized the need for Workers JS calc is rarely the bottleneck
    • 142. Web Workers pros: Could be used with gfx3d, Data Stores, Charts, THE GRID, and crypto (which does utilize Gears Workers) IE10 will use messaging between workers - interesting possibilities Safari has child Workers cons: Modern JavaScript performance has minimized the need for Workers JS calc is rarely the bottleneck Most devs who understand the need for Workers wouldnt necessarily need a DojoX class to help them
    • 143. Web Workers pros: Could be used with gfx3d, Data Stores, Charts, THE GRID, and crypto (which does utilize Gears Workers) IE10 will use messaging between workers - interesting possibilities Safari has child Workers cons: Modern JavaScript performance has minimized the need for Workers JS calc is rarely the bottleneck Most devs who understand the need for Workers wouldnt necessarily need a DojoX class to help them IE9 and older would use timeouts - not very effective deprecation. Most likely you would want to disable the feature.
    • 144. Web Workers pros: Could be used with gfx3d, Data Stores, Charts, THE GRID, and crypto (which does utilize Gears Workers) IE10 will use messaging between workers - interesting possibilities Safari has child Workers cons: Modern JavaScript performance has minimized the need for Workers JS calc is rarely the bottleneck Most devs who understand the need for Workers wouldnt necessarily need a DojoX class to help them IE9 and older would use timeouts - not very effective deprecation. Most likely you would want to disable the feature. The API isn’t hard! You don’t need Dojo!
    • 145. Web Workers
    • 146. Pa ssWeb Workers
    • 147. Geolocation
    • 148. Geolocation
    • 149. Geolocation
    • 150. Geolocation
    • 151. Geolocation It tells you where you are.
    • 152. Geolocation It tells you where you are. The API is: navigator.geolocation.getCurrentPosition
    • 153. Geolocation It tells you where you are. The API is: navigator.geolocation.getCurrentPosition
    • 154. Geolocation It tells you where you are. The API is: navigator.geolocation.getCurrentPosition It has to ask your permission to tell you where you are. Sometimes it works. It returns a longitude and latitude.
    • 155. Geolocation It tells you where you are. The API is: navigator.geolocation.getCurrentPosition It has to ask your permission to tell you where you are. Sometimes it works. It returns a longitude and latitude. This is where we are!38 ° 53.9249 Who o ho o!-77 ° 2.2610
    • 156. Geolocation
    • 157. GeolocationPros:
    • 158. GeolocationPros: Could be used with dojox.geo
    • 159. GeolocationPros: Could be used with dojox.geoCons:
    • 160. GeolocationPros: Could be used with dojox.geoCons: So simple, Dojo is not needed.
    • 161. GeolocationPros: Could be used with dojox.geoCons: So simple, Dojo is not needed. Third party workarounds may have license issues.
    • 162. Pa ss GeolocationPros: Could be used with dojox.geoCons: So simple, Dojo is not needed. Third party workarounds may have license issues.
    • 163. Storage & Offline
    • 164. Storage & Offline
    • 165. Offline
    • 166. Offline You can download all the necessary files for a web app and use it when you’re not connected.
    • 167. Offline You can download all the necessary files for a web app and use it when you’re not connected. Most people are always connected, and most devs assume their audience is always connected. Building an app so that someone can use it on an airplane is a niche case
    • 168. Offline You can download all the necessary files for a web app and use it when you’re not connected. I do! Most people are always connected, and most devs assume their audience is always connected. Building an app so that someone can use it on an airplane is a niche case
    • 169. Storage
    • 170. Storage Some apps simply need more storage space than a 4k cookie
    • 171. Storage Some apps simply need more storage space than a 4k cookie Doesn’t get sent with, and overload, server requests, like cookies
    • 172. Storage Some apps simply need more storage space than a 4k cookie Doesn’t get sent with, and overload, server requests, like cookies It’s just a big cookie - with odd security
    • 173. Storage / Offline http://diveintohtml5.org
    • 174. Storage / OfflinePros: http://diveintohtml5.org
    • 175. Storage / OfflinePros: DojoX RPC includes offline capabilities http://diveintohtml5.org
    • 176. Storage / OfflinePros: DojoX RPC includes offline capabilities DojoX Storage gets kudos in Mark Pilgrim’s Dive Into HTML5, which handles the very complex disparity between APIs. http://diveintohtml5.org
    • 177. Storage / OfflinePros: DojoX RPC includes offline capabilities DojoX Storage gets kudos in Mark Pilgrim’s Dive Into HTML5, which handles the very complex disparity between APIs.Cons: http://diveintohtml5.org
    • 178. Storage / OfflinePros: DojoX RPC includes offline capabilities DojoX Storage gets kudos in Mark Pilgrim’s Dive Into HTML5, which handles the very complex disparity between APIs.Cons: Flash solutions are not ready until well after page load. http://diveintohtml5.org
    • 179. Storage / OfflinePros: DojoX RPC includes offline capabilities DojoX Storage gets kudos in Mark Pilgrim’s Dive Into HTML5, which handles the very complex disparity between APIs.Cons: Flash solutions are not ready until well after page load. IE9 doesnt have Application Cache (offline). http://diveintohtml5.org
    • 180. Storage / Offline
    • 181. A-Storage / Offline
    • 182. Web Sockets
    • 183. Web Sockets
    • 184. Web Sockets
    • 185. Web Sockets The HTML 5 WebSocket specification defines a single-socket full-duplex (or bi-directional) connection for pushing and pulling information between the browser and server.
    • 186. Web Sockets The HTML 5 WebSocket specification defines a single-socket full-duplex (or bi-directional) connection for pushing and pulling information between the browser and server. Stop! You’re turning me on!
    • 187. Web Sockets
    • 188. Web Sockets WebSockets are not in HTML5 due to security disagreements.
    • 189. Web Sockets WebSockets are not in HTML5 due to security disagreements.
    • 190. Web Sockets
    • 191. AWeb Sockets
    • 192. A Web SocketsPros:
    • 193. A Web SocketsPros: CometD has been around for years and WebSockets didnt even make the HTML5 final cut. Nuff said!
    • 194. A Web SocketsPros: CometD has been around for years and WebSockets didnt even make the HTML5 final cut. Nuff said!Cons:
    • 195. A Web SocketsPros: CometD has been around for years and WebSockets didnt even make the HTML5 final cut. Nuff said!Cons: None! It rocks!
    • 196. Web Audio API
    • 197. Web Audio API
    • 198. Web Audio API
    • 199. Web Audio API Generate sound effects and tones, even voice simulations. Modify sound files.
    • 200. Web Audio API Generate sound effects and tones, even voice simulations. Modify sound files. Chrome and Firefox have the only implementations.
    • 201. Web Audio API Generate sound effects and tones, even voice simulations. Modify sound files. Chrome and Firefox have the only implementations. Chrome and Firefox have different APIs.
    • 202. Web Audio API
    • 203. I (Inco mplete)Web Audio API
    • 204. I (Inco mplete) Web Audio APIPros:
    • 205. I (Inco Web Audio API mplete)Pros: Flash has the capability, but it’s API is even more raw than the W3C Audio Incubator Group spec.
    • 206. I (Inco Web Audio API mplete)Pros: Flash has the capability, but it’s API is even more raw than the W3C Audio Incubator Group spec.Cons:
    • 207. I (Inco Web Audio API mplete)Pros: Flash has the capability, but it’s API is even more raw than the W3C Audio Incubator Group spec.Cons: Would be a difficult implementation with few real uses outside of gaming.
    • 208. CSS3
    • 209. CSS3
    • 210. CSS3
    • 211. CSS3 Who doesn’t know what CSS3 is? DUH!! It’s HAWT
    • 212. CSS3 Who doesn’t know what CSS3 is? DUH!! It’s HAWT Browser vendors moving WAY too slow on some of this.
    • 213. CSS3 Who doesn’t know what CSS3 is? DUH!! It’s HAWT Browser vendors moving WAY too slow on some of this. How long do you need to agree on how to draw a gradient?
    • 214. CSS3 Who doesn’t know what CSS3 is? DUH!! It’s HAWT Browser vendors moving WAY too slow on some of this. How long do you need to agree on how to draw a gradient? All those -moz, -webkit, etc prefixes are really bulking up and polluting my style sheets
    • 215. CSS3
    • 216. CSS3 Pros:
    • 217. CSS3 Pros: Less CSS helps with some problems
    • 218. CSS3 Pros: Less CSS helps with some problems dojox.css3 transforms rock (Nicola Rizzo)
    • 219. CSS3 Pros: Less CSS helps with some problems dojox.css3 transforms rock (Nicola Rizzo) has() can theoretically help with prefix trouble
    • 220. CSS3 Pros: Less CSS helps with some problems dojox.css3 transforms rock (Nicola Rizzo) has() can theoretically help with prefix trouble Cons:
    • 221. CSS3 Pros: Less CSS helps with some problems dojox.css3 transforms rock (Nicola Rizzo) has() can theoretically help with prefix trouble Cons: has() not helping with prefix trouble (where is it?)
    • 222. CSS3 Pros: Less CSS helps with some problems dojox.css3 transforms rock (Nicola Rizzo) has() can theoretically help with prefix trouble Cons: has() not helping with prefix trouble (where is it?) Old-ass IE™ probably impeded proper CSS3 progress
    • 223. CSS3
    • 224. C+CSS3
    • 225. Audio Tag
    • 226. Audio Tag
    • 227. Audio Tag
    • 228. Audio Tag Generate sound effects and tones, even voice simulations. Modify sound files.
    • 229. Audio Tag Generate sound effects and tones, even voice simulations. Modify sound files. Audio is so 90s! Everyone wants VIDEO now!
    • 230. Audio Tag Generate sound effects and tones, even voice simulations. Modify sound files. Audio is so 90s! Everyone wants VIDEO now! Firefox doesn’t even support MP3 (but they support WAV files... WTF??)
    • 231. Audio Tag
    • 232. Audio TagPros:
    • 233. Audio TagPros: dojox.av.FLAudio plays MP3 files
    • 234. Audio TagPros: dojox.av.FLAudio plays MP3 filesCons:
    • 235. Audio TagPros: dojox.av.FLAudio plays MP3 filesCons: ...but it’s no where near HTML5 compliant!
    • 236. F Audio Tag With the possibility of raising the gr if implemente 1.8! a de d inPros: dojox.av.FLAudio plays MP3 filesCons: ...but it’s no where near HTML5 compliant!
    • 237. Video Tag
    • 238. Video Tag
    • 239. Video Tag
    • 240. Video Tag Video is so hot, it’s insane.
    • 241. Video Tag Video is so hot, it’s insane. Remember ? I work here
    • 242. Video Tag Video is so hot, it’s insane. Open source (free) players are in large demand. Remember ? I work here
    • 243. Video Tag Video is so hot, it’s insane. Open source (free) players are in large demand. Firefox doesn’t play MP4 files. Remember ? I work here
    • 244. Video Tag Video is so hot, it’s insane. Open source (free) players are in large demand. Firefox doesn’t play MP4 files. Who loves OGG? Halla! Remember ? I work here
    • 245. Video Tag Video is so hot, it’s insane. Open source (free) players are in large demand. Firefox doesn’t play MP4 files. Who loves OGG? Halla! Mozilla jacked with the fullscreen API crying “SECURITY!” Remember ? I work here
    • 246. Video
    • 247. Video
    • 248. VideoIn progress!
    • 249. VideoIn progress! A “super” video player that should handle most formats in most browsers
    • 250. VideoIn progress! A “super” video player that should handle most formats in most browsers dojox.av.Video Normalized API HTML5 Silverlight Render Quicktime Flash
    • 251. Video Tag
    • 252. Video TagPros:
    • 253. Video TagPros: I’m working on it, so it will be AWESOME!
    • 254. Video TagPros: I’m working on it, so it will be AWESOME!Cons:
    • 255. Video TagPros: I’m working on it, so it will be AWESOME!Cons: (to be filled out when I think of something)
    • 256. N GVideo TagPros: I’m working on it, so it will be AWESOME!Cons: (to be filled out when I think of something)
    • 257. N GVideo Tag “No gra de”, not “no go o d.”Pros: I’m working on it, so it will be AWESOME!Cons: (to be filled out when I think of something)
    • 258. Final Grade
    • 259. Final Grade B +
    • 260. Final WordOur most precious commodity is...developer brain cells. - Kris Zyp