Shaun Abram
Technology and Leadership Blog
HTML5 talk at Google Technology User Group
Last Wednesday, I attended a talk on HTML5 at the Silicon Valley Google Technology User Group (SV GTUG). HTML5 is a broad term for the next generation of web technologies, including (obviously) the next and long overdue version of HTML, as well as CSS and JavaScript Libraries. The talk was in 3 sections: The first by Seth Ladd (a Developer Advocate for Google) was an introduction to HTML5; The second by Tab Atkins Jr. (a Software Engineer at Google) was on the new HTML5 <video> and <canvas> tags; And the third and final section was by Nathan Naze (also a software engineer at Google) on the Closure JavaScript Library.
Intro to HTML5
Seth Ladd’s introduction was the highlight of the night for me.
New JavaScript capabilities
He started talking about the new capabilities of JavaScript Libraries:
Web storage
aka Local Storage or DOM Storage
A way to store data on the client side (crash safe), making it crash safe and a good way to store, for example, user preferences. It is similar in some way to cookies, but offers more storage (5-10MB)and better programmatic interfaces.
http://diveintohtml5.org/storage.html
Web SQL Database
Web Storage is useful for storing simple key value pairs but not for more complex relational data. That is where the new Web SQL Database API comes into play. It brings SQL to the client side. Databases can be created on the fly, updated queried like any server side database and can involve asynchronous transactions for a more responsive user experience.
http://html5doctor.com/introducing-web-sql-databases/
http://openbit.co.uk/?p=135
Application Cache API
Prior to HTML, most browsers performed some kind of caching, but it could be inconsistent and of limited value (e.g. try refreshing a web page when you have no internet connection). With the offline application caching API, you (the developer) can specify exactly what should be cached by using a manifest file. This can result in a faster browser experience with less load on the server and, of course, means web pages can still be browsed even when you go offline.
Web Workers
Web workers are kind of like threads for your HTML apps. Your can now spawn background workers running scripts in parallel to the main page.
Web Sockets
Bi directional, full duplex communication channels over a single TCP socket, designed to be implemented in web browsers and web servers.
Notifications
How do we deliver a more desktop like experience to users?
Notifications can appear transiently in upper right hand corner. They fade in and fade out rather than being intrusive or modal.
Drag & drop
This was one of the most interesting (at least from a visual perspective) aspects of the new JavaScript APIs. Drag & Drop provides a very desktop like experience. Similar functionality could previously be provided by using libraries with JQuery, but now you no longer need to do crazy workarounds, or browser specific solutions.
Geo Location
Imprecise forms of geolocation have been available for a while, for example via best-guess based on your IP address. But the new Geo Location capabilities provide more reliable ways to provide location specific or customized content and functionality.
New HTML5 Capabilities
Seth’s next section was HTML5 itself, i.e. the new capabilities in HTML itself.
New semantic tags
He talked about the new semantic tags (such as section/article/header and aside) that can be used as a way to avoid ‘div’itus.
New link relations
Several new rel attributes for the <a> and <ink> elements have been introduced for HTML5.
Micro data
Is intended to provide a simple way to embed semantic markup into HTML documents, without the complexities of approaches such as RDFa (Resource Description Framework in Attributes).
ARIA attributes
Attributes for enhancing the accessibility of RIAs (Rich Internet Applications)
New form field types
e.g. can specify valid input ranges
Audio & Video
e.g. audio & video tags can interact with JavaScript, Canvas
e.g. Javascript can control video
Canvas
A Canvas is a 2Dimensional drawing surface that can be manipulated pixel by pixel.
New CSS Capabilities
Finally, Seth talked about the new CSS aspects of HTML5, including the new font support, columns (no JavaScript required!) and Sliders, which can be implemented using just css with no JavaScript required.
HTML5 <video> and <canvas> Tags
The 2nd of the 3 presentations was by Tab Atkins Jr., on the new HTML5 <video> and <canvas> Tags.
Closure JavaScript Library
The final presenter was Nathan Naze on the Closure JavaScript Library.
Closure is Google’s ‘Standard Lib’ for JavaScript. It is designed for large scale web development and is the Javascript library behind Google web apps such as GMail, Blogger and Google Books.
It was started in 2005 and is made exclusively by developers working on their 20% projects.
My overall impressions of Closure were that it is a complex, powerful and stable JavaScript library but with a steep learning curve best suited to large scale development (e.g. enterprise apps developed by large teams). It seems a useful library, but not something I would consider using for the upcoming GTUG HTML5 campout for example, where something a little more lightweight might be more useful.
Links
http://www.webreference.com/authoring/languages/html/HTML5/
Tags: Closure, CSS, gtug, html, html5, JavaScript