explaingit

lordfb/wbrenderer

0JavaScriptAudience · developerComplexity · 4/5ActiveSetup · easy

TLDR

JavaScript reimplementation of the 1990s BRender 3D engine that draws every triangle in software on the CPU, writing pixels straight to an HTML canvas. No WebGL.

Mindmap

mindmap
  root((wbrenderer))
    Inputs
      BRender DAT model files
      MAT material files
      PIX pixel maps and palettes
    Outputs
      Software-rendered 3D scene on canvas
      Flat, Gouraud, and textured triangles
    Use Cases
      Open old Carmageddon-era assets in a browser
      Learn CPU triangle rasterization
      Port BRender C code to JavaScript
    Tech Stack
      JavaScript
      ES6
      HTML Canvas

Things people build with this

USE CASE 1

Render 1990s BRender DAT and PIX assets in a modern browser without WebGL

USE CASE 2

Learn how flat, Gouraud, and palette-textured rasterizers work by reading clean JS

USE CASE 3

Port pieces of old BRender C code by following the matching Br facade API

USE CASE 4

Build a retro-styled demo scene with directional, point, and spot lights plus distance fog

Tech stack

JavaScriptES6CanvasNode

Getting it running

Difficulty · easy Time to first run · 30min

Single ES6 module with no runtime dependencies. Old BRender DAT, MAT, and PIX assets needed to see anything beyond test scenes.

In plain English

WBrenderer is a JavaScript recreation of BRender, a 1990s 3D graphics library from a company called Argonaut that was used to power old games like Carmageddon and FX Fighter. The point of the project is to do the entire 3D pipeline in plain JavaScript running in a normal browser, without using WebGL or any other GPU acceleration. Every triangle is drawn one pixel at a time by code on the CPU, and the final image is written directly into a normal HTML canvas through the standard ImageData buffer. The library is a single ES6 module with no external runtime dependencies. It offers three different triangle drawing modes: flat shaded, smooth shaded with the technique called Gouraud, and textured with palette indexed colours like the DOS games of that era. It also includes loaders for the original BRender file formats, namely .DAT for 3D models and scene hierarchies.MAT for material descriptions, and .PIX for pixel maps and colour palettes, so original game assets can be opened and displayed directly. On top of that, there is a scene graph where 3D objects are arranged as actors with positions and rotations, a camera with adjustable field of view, and light sources of directional, point, and spot types with distance attenuation, plus linear distance fog. The author has tried to keep the file layout, function names, and API surface close to the original BRender C source code, including a Br facade that mimics the original BrXxx global functions, so that anyone porting old C code has a familiar starting point. Performance numbers in the README, measured on Node 20 on Windows 10, claim throughput of about 132,000 flat triangles per second, 117,000 Gouraud triangles, and about 74,000 textured triangles, which is well below a GPU but reasonable for pure JavaScript software rendering. The repo also includes 23 test files with 66 unit tests covering the maths, the pixel buffers, all three triangle paths, the scene graph, the loaders, and the frozen public API. The status section lists five milestones already complete, ending with a sample port and an API freeze. Known gaps include proper near plane polygon clipping, support for the Carmageddon EAGLE.ACT actor file with wheels and sub models, real palette extraction from a DRRENDER.PAL file, and an experimental WebAssembly SIMD path that is currently just a stub. The repo has zero stars at the time of writing, no listed license, and a live demo on Netlify.

Copy-paste prompts

Prompt 1
Show me a minimal HTML page that loads wbrenderer and renders a spinning textured cube on a canvas
Prompt 2
Walk through the Gouraud triangle path in wbrenderer and explain how interpolation works
Prompt 3
Write a small loader using wbrenderer that parses a DAT file and lists the actors inside it
Prompt 4
Profile the textured triangle path in wbrenderer and suggest one realistic speedup
Open on GitHub → Explain another repo

Generated 2026-05-22 · Model: sonnet-4-6 · Verify against the repo before relying on details.