Home arrow HTML arrow Page 2 - Learning HTML5 Game Programming

Learning HTML5 Game Programming

If you know how to use HTML5 and want to branch out into web-based online games, you don't need to master Flash. With the help of the book Learning HTML5 Game Programming by James L. Williams, you can start exploring this fascinating terrain. Keep reading for our review.

Author Info:
By: Alejandro Gervasio
Rating: 3 stars3 stars3 stars3 stars3 stars / 12
November 18, 2011
  1. · Learning HTML5 Game Programming
  2. · More Book Details

print this article

Learning HTML5 Game Programming - More Book Details
(Page 2 of 2 )

The <canvas> element’s API: an in-depth look

As I explained at the beginning, you just can’t start building engaging HTML5 games from scratch without having at least an average background in the API that the <canvas> element exposes. A good example of this comes in chapter 5. It shows how to use some methods of the API to draw on screen basic shapes using paths, lines, fills and strokes. In addition, you’ll learn how to bring nifty animations to life with Trident.js, an animation JavaScript library ported from Java. And to translate some practical examples into the real world, the chapter also demonstrates how to build a memory game similar to the classic Simon (you remember that one, right?), with MIDI tones and all. To sum up: chapter five will walk you through the depths of the <canvas> API, and spice things up with a little bit of matrix theory.

Climbing uphill: getting the most out of SVG with RaphaëlJS and WebGL

Even though the vast majority of the chapters reviewed so far are fairly digestible (with some caveats, of course), this perception changes in chapters 6 and 7. These chapters offer a full-blown introduction to creating some sample games by exploiting both the functionality of the SVG/RaphaëlJS tandem and the joined forces of WebGL/Three.js.

While this may sound like a cliché, just one word can describe the contents of these chapters: overwhelming. But that’s not the author’s fault. In fact, taming such wild creatures and mastering the impressive facilities they provide right out of the box are not tasks one can complete overnight. Moreover, the sections include plenty of code samples that will teach you how to create pretty realistic 3D environments, and how to implement typical atmospheric components, such as lighting, shadows, shaders, blending modes and occlusion, by using the aforementioned frameworks. To sum up: if you aren’t knowledgeable enough on most of these topics, you’ll find these chapters the most daunting ones in the book. That may be harsh, but it's true.

“JavaScript-less” web programming: introducing the Google Web Toolkit, CoffeeScript and Pyjamas

Remember my first warning, when I stated you would need to have some background in Java and a few other little-known languages for get successfully through this book? Well, chapter 9 is exactly where this applies. It shows you, with a decent number of examples, how to draw things, play audio and create some basic web games, by means of a “JavaScript-less” approach (the term isn’t entirely correct, as you’ll see in a moment). So how is this achieved?

In reality, the chapter shows how to get things rolling with the Google Web Toolkit, CoffeeScript (a language similar to Python that compiles to JavaScript), Cappuccino and Pyjamas (a Python port of Google Web Toolkit). All of these alternatives run on the server, and produce JavaScript either at compilation or runtime. This allows you to create games in the browser without relying on a proprietary plug-in (as in the case of Flash).

Personally, I found this chapter to be quite instructive and easy to follow, even though I wasn't very familiar with some of these “alternative” solutions. Put in a simple way: this is a piece worth reading, particularly if you already understand the ways of the Google Web Toolkit.

Dealing with Multiple Game Players

After making my way through the previous chapters, one idea was already clear in my mind: creating a fairly functional HTML5 game requires the interoperability of multiple frameworks, languages and technologies. This fact can cause the knees of even the most experienced web developers to tremble.  But when I started reading chapter 9, that frightening idea quickly become a palpable reality. In fact, this section explains how to set up a multiplayer game server by taking advantage of the functionality brought by Node.js, the popular server-side JavaScript framework.

As one might expect, the task is far from straightforward. It not only requires the core abilities of Node.js, but also the ones provided by a few additional contenders, such a ExpressJS (a web application framework that works on top of Node.js), the CoffeeKup template system, Socket.IO (another library that works on top of Node.js) and finally NowJS, a server/side JavaScript library that facilitates the interaction of clients and servers when using Web Sockets. That's a pretty intimidating combination, indeed.

In any case, the chapter overall achieves its goal, especially when introducing you to using server-side JavaScript with Node.js and teaching you how to abstract Web Sockets communication between clients and the server via the Socket.IO/NowJS packages. As I said before, the chapter can’t be comprehended too quickly, so make sure to take your time to grasp the underlying logic of the complementary code samples.  It's a challenging, but doable, quest. 

Going Mobile: Diving Into the Depths of the Mobile Devices Arena

Considering the momentum gained by mobile apps in the last few years, you probably wonder if the book will show you how to take your web games successfully to the mobile arena. In fact, it will, and in great detail, over the course of chapter 10. Moreover, the section not only covers at a glance the most popular mobile device operating systems available nowadays, ranging from iOS and Android, to WebOS and Windows Phone 7, but goes through more advanced topics. These include how to store structured data on mobile devices by using Lawnchair, a storage API that allows you to interact easily with different store back-ends, such as localStorage, WebSQL, BlackBerry and a few more.

In addition, the chapter quickly discusses (too quickly, for my personal taste) how to add gesture/touch event support (the equivalent of mouse and keyboard events in tactile screens) to your mobile applications by means of jQueryMobile and Zepto.js, a small jQuery-compatible library. Finally, it shows, via a number of basic examples, how to package mobile apps by using PhoneGap and Appcelerator Titanium, two frameworks that make the whole packaging process pretty straightforward.

Although in general the chapter offers pretty detailed information on the aforementioned topics, I would have loved to see more hands-on examples regarding how to create a real world mobile app, including not only its main logic, but the processing/handling of touch events.

Does this mean the chapter isn’t worth reading? Not exactly. Nevertheless, if you expect to learn how to bring a functional mobile app to life, you may feel somewhat disappointed.  
Deploying Web Games
The book’s final chapter is mainly focused on covering the different approaches you can take to deploy/publish HTML5 games/applications. These include setting up your own hosting service, or picking up some third-party options, such as Hosted Node.js, the handy Chrome Web Store, TapJS and Kongregate, two of the most dominant online game-hosting platforms to date. Even though the chapter provides relevant information on the subject (it will even guide you in turning your HTML5 apps into desktop ones), I found it excessively and unnecessarily lengthy; it covers additional topics, like the inner workings of “traditional” DNS, dynamic DNS services and even how to minify/optimize your source code with Google Closure Compiler.

My final piece of advice for this chapter: focus only on the relevant sections that compile the corresponding hosting/deploying/publishing options, which are indeed instructive and insightful. The rest can be easily skipped over, or even replaced with more detailed information from different sources. As you know, the web offers plenty of them.
Final Thoughts

Taking into consideration the current ins and outs of HTML5, its ever-lasting “work in progress” nature, along with the numerous voids that the standard still displays at the bare bones level (not to mention in the field of web game development), I have to conclude that the book Learning HTML5 Game Programming by James L. Williams is overall a well-written piece that deserves an in-depth reading.

It not only attempts to fill the existing gaps with solid, understandable web programming theory, but it provides a (sometimes overwhelming) wealth of third-party resources and technologies that helps to make development a lot less painful.

Therefore, if you’ve already tasted many of the sweets that HTML5 brings to the table and now want to use them to start creating your own web games, at least at a basic level, the book will make the migration process reasonably pleasant.

P.S: I’d like to give a big thank you to Heather Fox, from Addison-Wesley (AW), Prentice Hall and SAMS (informit.com), who kindly provided me with a copy of the book for doing this review.

DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.

blog comments powered by Disqus

- Does HTML5 Need a Main Element?
- Revisiting the HTML5 vs. Native Debate
- HTML5: Not for Phone Apps?
- HTML5 or Native?
- Job Hunting? Freelancer.com Lists This Quart...
- HTML5 in the News
- Report: HTML5 Mobile Performance Lags
- The Top HTML5 Audio Players
- Top HTML5 Video Tutorials
- HTML5: Reasons to Learn and Use It
- More of the Top Tutorials for HTML5 Forms
- MobileAppWizard Releases HTML5 App Builder
- HTML5 Boilerplate: Working with jQuery and M...
- HTML5 Boilerplate Introduction
- New API Platform for HTML5

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2018 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials