Guest post by Imran Nazar , a developer, author, and gamer.

I get nostalgic sometimes. I think back to the days of the Commodore 64, the Gameboy and other such simple consoles of the 1980s, and I wonder: can you play those games on a modern computer? Is it possible to relive the original Tetris, to play Giana Sisters or Elite all over again?

The answer, of course, is that you can. By putting a layer in between your computer and the game, the computer can be made to look like the original console for the game. The basic process is called emulation, and there are hundreds of emulators of every kind of system or console, all the way from a VMS mainframe to the PlayStation 2.

Which pieces do you need for an emulator to work?

• Some kind of graphic output so you can see the game when it’s running. (Sound output is also useful, but not an absolute requirement.)
• A way to take in keypad input, such as directional and fire buttons, to allow you to actually play the game.
• Most of all, because the emulator runs every bit of the game in its own environment, you need speed for the core process: ideally, millions of basic operations per second.

HTML5 for Emulation?

With the introduction of HTML5 elements, and related work on Firefox and other browsers, we can now get all of these things in the browser:

• Graphics are made simple by the element, which can be used in its 2D context to output a rasterised screen. It’s much simpler to use the canvas than involve plugins such as Flash and Silverlight, since the canvas is built into the browser from the start.
• Simple keypress events are all that are needed to capture keys for input to the emulation. These have been available to JavaScript in a browser essentially forever, and are well documented.
• New JavaScript engines such as the upcoming Jäger extensions to Tracemonkey mean much higher speeds for the core processing, more than enough to cover emulation of a basic system.

So, all the bits are there in a browser. There are just a few questions left.

How?

How do you write an emulator, anyway? I’ve done more than a fair share of emulator development, but I’ve never come across a coherent tutorial series that explained, step by step, how to do it. I decided to make just that: a series of articles that starts with the very basics, and ends up with a working game console emulator. One of the simplest consoles in existence is probably the Gameboy handheld: since the focus of these articles was to be the structure of the emulator, and not the intricacies of the particular console, the Gameboy’s a good place to start.

Do we need any fancy JavaScript frameworks like jQuery and the like? Probably not. Most of the work of an emulator isn’t done in handling pieces of the interface like the canvas or div blocks; the work is in interpreting each step of the game, so base JavaScript will do the job.

Why?

Having answered the question of how to put together an emulator, the only other question is: why write a console emulator? It’s a good way to learn the ins and outs of a particular console, and excellent for bringing together the lowest and highest levels of development.

And why build a console emulator in the browser, using JavaScript and HTML5? I say: why not?

For more information and a complete tutorial on how to build a Nintendo Emulator in JavaScript check out Imran’s series of blog posts!