melonjs-3d

melonJS 2

A modern & fully featured HTML5 game engine

melonJS is an open-source 2.5D game engine designed for indie developers — perspective and orthogonal cameras, GPU-accelerated tilemap rendering, post-processing effects, custom shaders, 3D mesh support, polygon-accurate physics, modern Tiled workflows, and high performance. Runs on WebGPU, WebGL 2 or Canvas2D with automatic fallback. The whole engine is ~250 KB minzipped of vanilla JS/TS, with no dependencies and no toolchain lock-in. Built with modern class syntax and bundled with esbuild.

melonJS is licensed under the MIT License and actively maintained by the team at AltByte in Singapore.

Why melonJS

melonJS is designed so you can focus on making games, not on graphics plumbing.

• Canvas2D-inspired rendering API — If you've used the HTML5 Canvas, you already know melonJS. The rendering API (save, restore, translate, rotate, setColor, fillRect, ...) follows the same familiar patterns — no render graphs, no shader pipelines, no instruction sets to learn.

• True renderer abstraction — Write your game once, run it on WebGPU, WebGL 2 or Canvas2D with zero code changes. The engine handles all GPU complexity behind a unified API: the default AUTO mode tries WebGPU first at startup, falls back to WebGL 2 if that is unavailable, and ultimately to Canvas, and the entire feature set renders identically on both GPU backends.

• Complete engine, minimal footprint — Physics, tilemaps, audio, input, cameras, tweens, particles, UI — a full game stack in a single tree-shakeable ES module. No dependency sprawl, no library stitching.

• Scenes, loaded in one call — level.load(name) brings an authored scene straight into your world. Tiled is a first-class citizen for 2D — orthogonal, isometric, hexagonal & staggered maps, animated tilesets, collision shapes, object properties, compressed formats, with GPU-accelerated tile rendering on the GPU backends — and glTF / GLB is the equivalent for 3D scenes: author in Blender (or any DCC tool), export a .glb, and the whole scene — meshes, materials, cameras, lights, and node animation — loads under a Camera3d, no per-mesh wiring. Animated models play back through the same animation API as a 2D Sprite.

• Batteries included, hackable by design — Get started in minutes with minimal setup. When you need to go deeper: modern class-based architecture, a plugin system for engine extensions, and a clean architecture that's easy to extend without fighting the framework.

About melonJS

melonJS is a fully featured game engine :

Compatibility

• Standalone library (does not rely on anything else, except a HTML5 capable browser)
• Compatible with all major browsers (Chrome, Safari, Firefox, Opera, Edge) and mobile devices

Graphics

• Fast GPU renderers (WebGPU and WebGL 2) for desktop and mobile devices, with fallback to Canvas rendering
• Since 20.0 the aging WebGL 1 path is retired and WebGL 2 is the baseline; devices offering only WebGL 1 fall back to the Canvas renderer under AUTO
• Extensible batcher system for custom rendering pipelines, with backend-neutral vertex formats and draw topologies (declare a layout once, describe it to either GPU backend)
• High DPI resolution & Canvas advanced auto scaling
• Sprite with 9-slice scaling option and frame animation
• Built-in effects such as tinting, masking, and the full set of CSS-style blend modes (normal, none, additive, multiply, screen, exclusion, darken, lighten, overlay, hard-light, color-dodge, color-burn, soft-light, difference) — all of them supported identically on WebGPU, WebGL 2 and Canvas since 20.2
• Standard spritesheet, single and multiple Packed Textures support
• Compressed texture support (DDS, KTX, KTX2, PVR, PKM) with automatic format detection and fallback
• Hardware antialiasing (antiAlias: true) on both GPU backends — and it survives post-processing, since the offscreen targets a post-effect chain renders into are multisampled to match
• Procedural noise textures: Noise (simplex/perlin/value/cellular, fBm / ridged / ping-pong fractal, domain warp; renderer-free and CPU-samplable for heightmaps, terrain, and spawn jitter) and NoiseTexture2d — bake a noise field into a sprite image, a Gradient color ramp, or a live-animated tangent-space normal map for lit water and surfaces; unified under a new Texture2d base alongside TextureAtlas
• 3D mesh rendering with OBJ/MTL model loading, multi-material support, hardware depth testing, and perspective projection via Camera3d — retained-mode geometry, uploaded to the GPU once and re-drawn from there, so moving, rotating, scaling or re-tinting a mesh costs no vertex upload and no per-vertex CPU work at all
• Mipmapped and anisotropically-filtered mesh textures on both GPU backends, so distant and grazing-angle geometry stops shimmering (opt out per mesh with textureFilter: "nearest" for crisp pixel-art models)
• Lighting, in 2D and 3D:
  • 2D — Light2d as a first-class Renderable (multiple dynamic lights, radial-gradient falloff, illumination-only mode, procedural rendering via drawLight), plus optional per-pixel normal-map shading on sprites for 3D-looking dynamic lights
  • 3D — Light3d directional, point, spot and ambient lights, added to the world like Light2d (half-Lambert diffuse + ambient fill, quadratic falloff and cone angles on the punctual types, runtime-manipulable for day/night), auto-loaded from a glTF scene's authored suns and lamps
  • up to 32 simultaneous lights on either path, with light data travelling in a uniform buffer — a static light rig costs zero GPU state changes per frame
• Ground ("blob") shadows for 3D objects — on by default — so characters and props read as standing on the floor instead of hovering. An ellipse matching the caster's own footprint and rotation, shrinking and fading with height above the ground; one extra draw per object, and one for an entire InstancedMesh scatter regardless of instance count. Shaped by the light rather than always straight down: shadowLight points a blob at a Light3d and is re-read every draw, so a day/night cycle carries every shadow with it, while shadowOffset slides it out from the caster's feet, shadowStretch lengthens it for a low sun, shadowScale sizes it independently of the object, and shadowGroundNormal lays it on a floor that is not level. All of