Building HTML5 games for windows 8

Building HTML5 games for Windows 8Dave VoylesTech Evangelist@DaveVoyles

JavaScript support in Visual Studio 12/13• Templates• Intellisense• Browser Link • Great debugging

tools• HTML5 debug

tools for Win8 are missing

Win.JS• Provides a set of new

controls designed for Windows Store apps using JavaScript

• Library of CSS and JavaScript files 

• Includes objects that help you handle activation, access storage, and define your own classes and namespaces

Getting Started

Create a new, blank, WinJS project

Source: Jesse Freeman

Manually add your files to the project

Source: Jesse Freeman

Further Reading: Jesse Freeman’s blog

Source: Jesse Freeman

JavaScript is slow.

Or is it……?

In comes Emscripten &Asm.js

How Emscripten worksEmscripten is an LLVM to JavaScript compiler.

It takes LLVM bytecode (e.g. generated from C/C++ using Clang, or from another language) and compiles that into JavaScript, which can be run on the Web.

How asm.js worksAsm.js comes from a new category of JavaScript application: C/C++ applications that’ve been compiled into JavaScript.

It’s a whole new genre of JavaScript application that’s been spawned by Mozilla’s Emscripten project.

Case Study

Epic Citadel

HTML5 game frameworks

Turbulenz

• Open source• 2D or 3D games• “The JavaScript syntax

resembles C, but the language has more in common with functional languages like Lisp; it has closures and first-class functions.”

Turbulenz

Case Study

Quake 4

Impact.js

Impact.js• $100• Debugging tools

built in• Level editor• Tons of plugins• Active community• Win8 ,iOS, Android,

Wii-U, etc.

Case Study

Super Rawr-Type

Resources• Building HTML5 games for Win8 – Jesse Freema

n• Porting Impact.js games to Win8 – Jesse Freema

n• WinJS Overview – MSDN• Impact.js and porting to Win8 – My blog• Hanselminutes podcast - Xbox

One Developer with Dave Voyles, formerly of Comcast

• Deep dive into WinJS for beginners