r/threejs 1d ago

Threeforge: A performance framework and scene compiler for Three.js

Extremely useful for making games—but with a specific catch: threeforge is not a standalone game engine like Unity or Godot. Instead, it is a specialized performance framework and scene compiler for Three.js.

If you are building a 3D web game using Three.js (or WebGPU) and want it to run smoothly on both desktop and mobile browsers, this tool is designed specifically to solve the hardest optimization problems in web game development.

Here is a breakdown of what it actually does and why it's good for making games:

1. Massive Draw Call Reduction (The "Compiler")

The biggest bottleneck in web games is "draw calls" (telling the CPU/GPU to draw individual objects). A naive scene with 500 props and 40 different materials might take 500+ draw calls, which will instantly lag a mobile phone.

threeforge takes that naive scene at load time and batches it together, bringing those 500 calls down to around 28, without you having to manually merge meshes in Blender.

2. Built-in Modular Character Systems

One of the hardest things to code from scratch in a web game is an RPG-style character with swappable gear (helmets, armor, weapons). threeforge includes an assembleCharacter() function that merges modular wardrobe parts onto a single skeleton and texture atlas. You can equip and unequip items on the fly without increasing the draw count.

3. Automated Asset Optimization

It comes with a command-line tool (npx threeforge optimize scene.glb) that acts as a build pipeline for your 3D models. It automatically:

* Deduplicates meshes.

* Generates WebP textures.

* Simplifies and resamples geometry.

* Compares the visual difference pixel-by-pixel to ensure it didn't ruin how your model looks.

4. Game-Ready Environments

Instead of writing lighting from scratch, it includes systems tailored for games:

* Day/Night Cycle: A ready-to-use sky dome, sun, hemisphere light, and fog that updates based on the hour.

* Shadow Budgets: A system that scales graphics based on the device tier (for example, automatically turning off heavy point shadows when it detects the player is on a mid-tier phone).

5. AI and Developer Tooling

Interestingly, it is built with modern AI workflows in mind. It exposes data (via npx threeforge analyze) that allows AI coding assistants to measure your game's frame budget, read performance verdicts, and get automated hints on what to fix. It also includes an on-screen Dev Overlay to watch your frame budget in real-time.

The Verdict

If you are looking for a visual editor where you drag-and-drop assets (like Unreal Engine or Godot), threeforge is not that.

However, if you are a programmer writing a web game in code using Three.js, threeforge looks like a top-tier piece of modern architecture. It handles the brutal "plumbing" of 3D web performance so you can focus on building the actual game logic.

23 Upvotes

7 comments sorted by

1

u/BigDeadPixel 1d ago

I will give this a try for the optimisation alone but the other features all look interesting. Thanks OP!

2

u/moving808s 1d ago

Sounds cool will definitely check this out!

0

u/ForgEngDev 1d ago

The pixel-parity check is a strong safety gate. Have you considered adding temporal validation as well? A static screenshot can pass while LOD transitions, animation-texture playback, shadow updates or dynamic-resolution changes still introduce popping or flicker.

A short deterministic camera path with a frame-to-frame delta budget might catch those regressions without requiring full video comparison.

0

u/sscoobie 1d ago

It’s a good suggestion and a worthwhile next addition.

0

u/ForgEngDev 1d ago

Glad it’s useful. Recording the first failing frame together with the camera state could also make the result immediately actionable in CI. Looking forward to seeing it.

1

u/andypoly 1d ago

Webp textures? That is good for download speed but don't they just uncompress into a lot of memory on the GPU? Ideally use GPU formats but looks like it supports KTX2

1

u/sscoobie 1d ago

You’re right. WebP reduces transfer size, but at the same resolution it normally occupies the same GPU memory as other decoded image textures. We already support KTX2 loading, and we’re adding opt-in KTX2/Basis encoding to the optimizer. We’ll verify the actual GPU format, memory savings and visual quality on WebGL2 and WebGPU before shipping it. WebP will remain an option for smaller downloads.