In a recent post I looked at one of the major benefits that the HTML5 video tag could bring to to the average net user, if only the vested interests could reach an agreement. Continuing on the HTML5 theme, I've decided to learn a little more about the canvas tag, by far the most interesting feature of HTML5.

Why was it created?

The tag was introduced as part of the Apple's WebKit browser engine (adapted from KHTML) and later accepted as part of the upcoming HTML5 standard by WHATWG. It's also been implemented into Mozilla's Gecko engine used by most notably by Firefox, and is also supported by Google's Chrome since it's also based on WebKit. The lack of truly interactive graphics has long been a limitation of HTML and the canvas tag seeks to address that. It simply allows a programmer to define a two dimension region of the page into which Javascript can be used to draw. It sounds simple, but it's something that web developers have long been crying out for.

What about Flash?

Flash is a browser plug-in designed to provide an interactive media platform for web pages, and has become a de-facto standard. It was generally only supported for a 32 bit Windows platform, but more recently, Adobe began a project to build a more maintainable version of Flash which could be ported to a variety of platforms including Linux. Flash is renowned for uses such as games, YouTube, "Punch the Monkey" and the ability to often max out a modern CPU while playing a simple video.

And Silverlight?

Silverlight is Microsoft's answer to Flash, arriving very late on the scene, offering fewer features than Flash and coming with some severe limitations such as supporting only Windows. It offers fewer features than Flash, but it is regarded as easier to write code for as support for it has been integrated into Visual Studio. Silverlight received a lot of negative publicity recently after Major League Baseball dropped it, returning to Flash after less than a year, with rumours of instability and a dwindling audience because of difficulties viewers were having installing the Silverlight player. The requirement that most users install a player when visiting a Silverlight web site for the first time is one of the biggest limitations for it's acceptance.

Microsoft, through Novell, has recently been pushing Moonlight, a Mono based implementation of Silverlight for Linux. Moonlight has all of Silverlight's problems and more, most notably that it's implemented in Mono which has been attracting a huge amount of negativity over Microsoft's refusal to categorically rule out suing Mono users, and that it's constantly a version behind Silverlight, so users are more likely to encounter incompatible Silverlight websites. If Microsoft really wants Moonlight to be taken seriously, it needs to move development in-house and release new versions for both platforms at the same time.

How do they compare to HTML5?

When combined with Javascript and the audio and other tags that are part of the HTML5 standard, canvas offers many of it's competitors capabilities, with some huge advantages, such as completely free implementations, like Gecko and WebKit, allowing it to run on nearly CPU architecture or platform.

Additionally, by being open source, it can also avoid many of the security issues that plague it's rivals, while having superior stability because it's integrated directly into the browser, rather than as a plug-in. The biggest disadvantage for the canvas tag at the moment is that it's new. Not all browsers support it fully, and the usual suspect, Internet Explorer, has no support whatsoever. This is not unexpected as the canvas tag competes directly with Microsoft's Silverlight, so I would not be expecting to see an Internet Explorer implementation until it becomes clear that significant numbers of users are switching away from Internet Explorer, at least in part because of it's poor support of HTML5.

Where can I get my share of HTML5?

HTML5 has been generating a lot of buzz recently because of it's potential. You can download a number of different browsers that at least partially support HTML5 and the canvas tag, such as Safari on the Mac (which you'll probably already have if you have a Mac), Firefox 3.5 or higher and Opera. Nearly all the browser engine vendors, besides Microsoft, are working feverishly to both boost the performance of Javascript and increase support for the proposed HTML5 standard, so the future is looking very bright.

Some usage examples

As I'm a programmer by trade and a Linux user by choice, I'm keenly interested in learning more about HTML5, so I'll shortly being writing up some tutorials about the canvas tag, which I'll be posting here for anyone else that's interested. Of course, if you are an Internet Explorer user, you'll need to download one of the free browsers mentioned in the previous paragraph to try the examples.