Game Maker and HTML5...

So we've sprung a little surprise on folks by releasing a video of a Poker Squares playing directly inside a browser using HTML5, but how was this done, and what does this mean?

Well, first... we've made NO decision as to how this will be used. That is if it'll be available to the public, if we'll sell an exporter, or if we'll use it to publish stuff ourselves. This was done in such quick order that we really don't know where it'll lead to, but you can be sure we're now thinking about it. We obviously realise that everyone would simply want it as a free part of Game Maker, but that's unlikely to happen as it'll take time and money to make. Aside from that... we simply have no idea, so don't ask because we simply don't know yet.

Now... as to the tech demo itself. This was a lot of fun to do. I'd never touched Javascript before so I hard to learn Javascript and HTML5 programming while writing this, and while some of it was a little odd for me, it actually went pretty smoothly. In fact, far smoother than any of us thought it would. The project took a week and a half of Russell's and my time; pretty much to the exclusion of everything else. But even with that, a week and a half to produce what we did is an amazing result.

Before I go any further, I should stress this is a standard Game Maker game converted "automatically" into HTML5. We didn't rewrite Poke Squares to make it look good on the web, it IS the iPad version of the game running unchanged inside the browser.

So, there are two main parts to this demo...1st, the runner (or engine), and second the GML conversion. Now this is the first time we've attempted to write a Game Maker runner from scratch. When Russell and I first started we had a code base in the form of the C++ runner, and although we hated it, it was what we started with. So writing this version was a particular challenge to me because there were still areas we've never looked at, and this time I would have to understand the flow completely. It's ended up being a great learning experience, because many of these "black holes" have now been clarified. Some have had us rolling our eyes as to why it was implemented in a certain way, and others have lead to a deeper understanding as to why something was implemented in a certain way.

So with the runner side progressing, Russell then started on the GML conversion. What's really exciting about this, is that we compile the GML, then output javascript directly. This means that browser will run it as it would any native code (thanks to the Just In Time compiler). Now, while there's lots of padding around it due to the way GML handles certain things, it does mean we have now put the "GML to High Level Language" conversion to the test - and it works!! Boy does it work!! Russell has done a great job of this conversion, so much so that a couple of games convert directly, and are runnable inside the browser WITHOUT ANY GML/GAME MAKER CHANGES AT ALL!!. This is staggering really, that in less than 2 weeks we have produced something that would just convert a game and run it.

Now the runner has some issues to be sure. We are currently using the HTML5 canvas tag, although we may well swap the WebGL at some point because it'll give us everything we need. Currently the Canvas tag is lacking in some key areas; tinting images being one of them. I currently cache a slow conversion of any rendering with a colour tint. It works... but if you changed the colours a lot, it'll grind to a halt. WebGL would fix that, although there is word that canvas may well support this soon anyway.

Now it has to be said that currently, HTML5 isn't the best thing in the world. It's actually pretty slow on most browsers, and although Chrome is pretty good, IE9 blows them all out the water - its amazingly quick. FireFox 3.x is runnable, but slow, Safari is just rubbish, and IE8 doesn't work at all. All this will change over time. HTML5 is the way browsers are heading, and they'll all just get better and better.

That said... the engine, and the GML's javascript conversion runs incredibly quickly. ALL the slowdown is in pixel drawing, where as everything else runs in a few percent of the time. This is great news. Not only does it mean that the way I've rewritten the engine works okay, but for totally unoptimised code, the JIT is doing a great job with it. This is all good for the future.

Now, running this on an iPad or mobile device is still gonna be slow - really slow. These devices aren't optimised for this kind of experience, so don't think that once this is out you can do your own iPad games. It's just a bit pooh. This means our iOS and Android runner still has a place, and is still valuable to us. This also goes for windows and Mac though. Anything that will run in HTML5 should run MUCH faster natively. Soi native runners are still valuable there too.

Lastly... security. Yep. Put a game on the web and everyone will get your source. Not really much that can be done with that. We thinking long and hard about this one, it's nasty to be sure. Leave it with us... we know about it, and we're thinking about it. We do have a few ideas, but need to think about it. We don't actually think putting the "runner" on the web is an issue. All the "smarts" are in the conversion process, and that wouldn't be there. You can also obfuscate the entire code base. Still. We're thinking about it, lets leave it at that for the moment.

So there are two big lessons I'll take from this. First, I now have a much better idea on how to manage the C++ runner, and how to rewrite the bits I hate that are slowing everything else down (the events being the main thing for me). Second, we now also know we can do some amazing things with GML, from optimise the interpreter, to convert it to a whole new language to get it compiled - or even compile it natively ourselves. This is all pretty exciting stuff to us as it's not JUST about how well the HML5 port went, it's also how we can now use this invaluable information to make future versions of Game Maker and it's runner better for everyone! So while these aren't quick fixes or changes, we are now armed better for the future, so when we do a rewrite, we'll know exactly what we need to do to make it fly!

EDIT: Theres a discussion about this here: http://gmc.yoyogames.com/index.php?showtopic=501194 in the Game Maker Community Forums (GMC), feel free to join in there.