โœจย Games & Demos

Before diving into web game development, you will probably wonder how far you can go with JavaScript and WebGL. Here is a collection of "HTML5 games" and tech demos that I find particularly impressive and polished.

PlayCanvas
Poki
OGL
Three.js
Three.js
Poki
PlayCanvas
Poki
Three.js
Three.js
Three.js
Babylon.js
Three.js
Babylon.js
Three.js
Babylon.js
Three.js
Three.js
PlayCanvas
Poki
React Three Fiber
PlayCanvas
PlayCanvas
Babylon.js
Poki
Three.js
Poki
Pixi.js
PlayCanvas
Poki
Babylon.js
PlayCanvas
Cocos
React Three Fiber
Babylon.js
Phaser
React Three Fiber
Three.js
Three.js
React Three Fiber
Pixi.js
Three.js
Three.js
PlayCanvas
Threlte
React Three Fiber
Three.js
React Three Fiber
Three.js

Tech demos

Metaverses

While not technically games, these web-based metaverses are built on top of WebGL and share many of the same challenges and solutions as games.

WebXR

WebAssembly

While it is not the focus of this website, it is worth mentioning that it is possible to run native code in the browser using WebAssembly. Here are some examples to give you an idea of the kind of performance you can expect from WebAssembly:

DOM-based games

Instead of drawing graphics on a canvas, you can create 2D games with DOM elements (divs, basically). Manipulating the DOM and using a lot of CSS effects can be expensive for the browser, particularly if you have many elements, but depending on your use case, it might work for you! Here are some examples:

To make this kind of game, you can use a library like React (opens in a new tab), Vue (opens in a new tab), or Svelte (opens in a new tab) to help architect your code.

๐Ÿ‘‹ Introduction๐ŸŒ Web Engines