BrowserQuest – a massively multiplayer HTML5 (WebSocket + Canvas) game experiment

It’s time for some gaming action with a new HTML5 game demo: BrowserQuest, a massively multiplayer adventure game created by Little Workshop (@glecollinet & @whatthefranck) and Mozilla.

Play the game: browserquest.mozilla.org

BrowserQuest is a tribute to classic video-games with a multiplayer twist. You play as a young warrior driven by the thrill of adventure. No princess to save here, just a dangerous world filled with treasures to discover. And it’s all done in glorious HTML5 and JavaScript.

Even better, it’s open-source so be sure to check out the source code on GitHub!

Watch a screencast:

EnglishShare

A multiplayer experience

BrowserQuest can be played by thousands of simultaneous players, distributed across different instances of the in-game world. Click on the population counter at any time to know exactly how many total players are currently online.

Players can see and interact with each other by using an in-game chat system. They can also team up and fight enemies together.

BrowserQuest is a game of exploration: the more dangerous the places you go, the better the rewards.

Powered by WebSockets

WebSockets are a new technology enabling bi-directional communication between a browser and a server on the web.

BrowserQuest is a demo of how this technology can be used today to create a real-time multiplayer game in a single webpage. When you start to play, your browser opens up a WebSocket connection to one of several load-balanced game servers. Each server hosts multiple world instances and handles the player synchronization and game logic within all instances. Because the server code is running on Node.js, both the server and client codebases share a small portion of the same JavaScript source code.

Server code is available on Github.

Built on the Web platform

BrowserQuest makes extensive use of different web technologies, such as:

• HTML5 Canvas, which powers the 2D tile-based graphics engine.
• Web workers, allowing to initialize the large world map without slowing down the homepage UI.
• localStorage, in which the progress of your character is continually saved.
• CSS3 Media Queries, so that the game can resize itself and adapt to many devices.
• HTML5 audio, so you can hear that rat or skeleton die!

Available everywhere

Since BrowserQuest is written in HTML5/JavaScript, it is available across a lot of different browsers and platforms. The game can be played in Firefox, Chrome and Safari. With WebSockets enabled, it’s also playable in Opera. Moreover, it’s compatible with iOS devices, as well as tablets and phones running Firefox for Android.

The mobile versions are more experimental than the desktop experience, which has richer features and performance, but it’s an early glimpse of what kind of games will be coming to the mobile Web in the future. Give it a try with your favorite mobile device!

Join the adventure

Want to be part of BrowserQuest? Create your own character and venture into the world. Fight enemies by yourself or with friends to get your hands on new equipment and items. You might even stumble upon a couple of surprises along the way…