In the process of writing this new Ajax book, I’ve been recounting the major steps forward that JavaScript has taken since it was first released way back in Netscape Navigator 2.0 and wondering what the future will bring. In my opinion, the next revolution for JavaScript is going to be the implementation of the <a title="Web Applications 1.0 - The bitmap canvas" rel="external" href="http://www.whatwg.org/specs/web-apps/current-work/#canvas"><canvas/></a> element.

What exactly is the <canvas/> element? It was originally created by Apple to support its Dashboard feature, it’s now part of the WHAT-WG Web Applications 1.0 specification. The <canvas/> element represents what’s essential a device-independent bitmap canvas that, when used with JavaScript, provides most of the drawing functions one would ever need.

Imagine, being able to draw any shape automatically as a page is being loaded, or creating animations without downloading actual images. Think of what this will do for online games or places like Google Maps that must currently rely on server-side rendering for all images. This could literally revolutionize Web user interface design as we know it. No longer will developers be saddled with using the pre-rendered form elements. Don’t like that checkbox? Design your own. Need a color picker? Just draw in on a canvas. Need a collapsible tree? Don’t worry about tables and divs, just draw it the way you want it. Ultimately, this could push technologies like VML and SVG out the door as developers are able to program their own graphics, making them resize, rotate, or skew, all by using JavaScript and a simple new element.

Already, Safari supports it and Firefox will soon. Since these are heavily used by developers, will it be long before we see Web sites take advantage of the <canvas/> element to produce incredible effects with canvas-assisted JavaScript? Check out what’s already possible.

Ladies and gentlemen, what would any revolution be without a catch phrase? We have Ajax already; I’m proposing that this new model of Web user interfaces be called…what for it…Cajun (Canvas Assisted JavaScript UnderNeath). Any sites that feature graphical user interfaces drawn on the <canvas/> element will be known as using the Cajun model. Who knows? Maybe my next book will have to be Professional Cajun for Web Developers?