Back to the blog
Development / DEVELOPMENT NOTES

A 2D game engine with Canvas and JavaScript

A small engine for exploring scenes, movement, and Canvas rendering without a game framework.

This 2D game engine brings together tools and techniques for building a game with web technologies. It renders to an HTML5 Canvas element, with game logic written in JavaScript.

Try the scene

Use the arrow keys to move and press X or the space bar to jump.

Follow a frame through the engine

An engine connects player input, state updates, and rendering. Following that path shows how a key press eventually changes what appears on screen.

The project is deliberately small. It is a way to explore its parts and change one of them without relying on a complete game-authoring tool.

Run the code

To run the project locally, serve its files through a web server. Opening the HTML directly from the file system may prevent resources from loading correctly.

Source code

Explore the project on GitHub

Written by Sergio Soriano

Development, curiosity, and shared projects.

About Sergio Soriano