getContext

The web is chan­ging around us, and it’s for­cing a re-think of how we do soft­ware. While tra­di­tional web applic­a­tions have been gain­ing trac­tion in the last few years, the domain of browser based gam­ing is still primar­ily based around Flash.

While Flash is fine for some pur­poses, it’s tied to one com­pany who ulti­mately owns the dir­ec­tion and licens­ing of the product. It’s expec­ted we’ll see a shift from the Flash browser plu­gin to an integ­rated fully web based plat­form with the intro­duc­tion of a num­ber of new APIs in HTML5:

Canvas
Allows draw­ing and 2D manip­u­la­tion of images on screen, gen­er­ally using hard­ware accel­er­a­tion to make the pro­cess extremely fast.
WebSockets
A new pro­tocol (mostly back­ward com­pat­ible with HTTP), imple­men­ted in the browser to allow a sus­tained real-time con­nec­tion to a remote server.
WebGL
An imple­ment­a­tion of OpenGL in the browser to allow sites to cre­ate and dis­play 3D graphics.
Web Storage
A new method of stor­ing data in the browser for off-line use.
Audio & Video
Native audio and video through the <audio> and <video> tags respect­ively. Browsers are also offer­ing (cur­rently pro­pri­et­ary) APIs for audio manipulation.

All of these fea­tures are exposed to the browser through the DOM or Javascript itself. In con­junc­tion, these tech­no­lo­gies make game cre­ation dir­ectly for the browser much more appeal­ing and viable.

Less than half of the world's population uses a modern web browser.
Data for the month of July 2011, by Net Applications.

The down-side is the long tail of browser upgrades. Microsoft’s Internet Explorer and some older ver­sions of Firefox are cur­rently still very widely used on the net, and as of July 2011 less than half of the browsers in use are suit­able for web-based gam­ing. This will change in time, of course, so it will be use­ful to be ready for when that time comes.

I’ve been play­ing with some of these fea­tures of Javascript for a couple of years now, and in par­tic­u­lar I’ve been work­ing on an iso­met­ric HTML5 game engine using Canvas. The pro­ject really reached a crit­ical point a few months ago when I cre­ated the first demo that could actu­ally be used inter­act­ively across the range of mod­ern web browsers. This blog will doc­u­ment the pro­cess of imple­ment­ing this game engine, as well as other related con­cepts and ideas that apply to game devel­op­ment in HTML5.

3 thoughts on “getContext”

  1. Hello Ashley,

    It’s good to see you start doc­u­ment­ing your gam­ing pro­jects. I need to get back into video games again too — rather than installing apps on andriod or whatever I do now that isn’t remotely a cool hobby.

    1. Thanks nic, I’m hop­ing that if I doc­u­ment enough of my find­ings it might be of use to other people in the same boat.

      And yeah, you should totally get back into 3D stuff, and help me out with some game graph­ics. :D

Leave a Reply