LittleJS just got the biggest update since it launched! It is still the small, fast, dependency-free HTML5 game engine it always was. Now it also has a full 3D renderer sharing the canvas with your 2D game, built-in level editors, a library of ready-made particle effects, a much faster core, and new tools for making games with AI.
\nThis is the big one! Meshes and shape builders, terrain and voxel maps with collision, shadow maps, colored lights and spotlights, fog, reflections, particles, trails, cameras, and custom shaders on any object. 3D objects are regular LittleJS objects with the same physics, children and timers as 2D, so the two mix freely: a 2D UI over a 3D scene, or a 2D game inside a 3D world.
\nPrefer Three.js for rendering? There is a plugin for that too!
\n2D got plenty as well: a new dynamic lighting system, one-way platforms, swept bullet collision, parallax layers, and improved object collision performance.
\nLevel editors, 2D and 3D, built into the engine. Press Escape in a debug build to pause the game, edit the level in place with undo, autosave and prefabs, then play on. The editor guide shows how to make them an editor for your own game. 2D levels load and save as Tiled JSON.
\nParticle effects library. Fire, smoke, sparks, explosions, rain and more, each one line: particleEffect('fire', pos), in 2D or 3D. Every effect takes scale, hue and saturation, and the particle designer tweaks them or builds new ones. Most games will not need anything else.
The example browser has over 100 short examples, each a single file that explains what it shows and how it works, with live editing and a Share button that puts your edited code in a link. It is the best place to learn the engine.
\nThe rendering core was reworked: batched 2D sprites on WebGL2, instanced 3D drawing, and far less per-draw overhead. To measure it I built a WebGL Engine Bench: the same two scenes, moving sprites and lit cubes, through LittleJS, PixiJS, Three.js, PlayCanvas, Phaser and Babylon.js, reporting how many objects each holds at 60 fps.
\nOn my machine LittleJS matched the fastest paths of the other engines and beat them in several. That is one machine and two workloads, so run it on yours: it works in the browser with nothing to install, and results and scene improvements from other engine maintainers are welcome.
\nLittleJS has a small, well documented API, with the whole thing in one reference file. That is exactly what coding AIs are good at, and it is the same thing that makes it readable for people. So it is now a first-class goal:
\nLittleJS was always meant to be a general purpose engine, that I could use for all my games. I started it small on purpose, with js13k as the proving ground, because keeping the core tiny and simple from day one is what makes an engine easy to learn and fast to run.
\nEverything since has built on that core: people wanted to make more and more ambitious things with it, and what they asked for most was 3D and tools. I wanted the 3D side to feel exactly like the 2D side, same objects, same loop, same small API, not a separate framework bolted on.
\nThe other reason is the community. LittleJS is not a one-person project any more: engine fixes, plugins, examples and a lot of games have come from other people, and the best way to push an engine forward is for people to make things with it. The third LittleJS Game Jam is running right now, October 2 to November 2. Come make something!
\nThe new website littlejsengine.com is a demo of all of this: a train ride through every feature, running on the engine.
\nThanks for reading! Give us a star oh GitHub if you like the project. 🚂
","headings":[{"level":2,"text":"2D and 3D in the same engine","id":"2d-and-3d-in-the-same-engine"},{"level":2,"text":"New Tools","id":"new-tools"},{"level":2,"text":"Even Faster","id":"even-faster"},{"level":2,"text":"Made for AI","id":"made-for-ai"},{"level":2,"text":"Why?","id":"why"},{"level":2,"text":"Try it!","id":"try-it"}]}}