webgl-operate logowebgl-operate logo

Build high-performance rendering applications with this use case agnostic, TypeScript based WebGL engine.

webgl-operate is an open source engine that enables hardware-accelerated 2D and 3D rendering and computation. It is highly extensible and facilitates arbitrary rendering approaches such as forward rendering, offscreen computing, multi-frame sampling, raymarching raytracing, or progressive pathtracing.

Get StartedDownload

Installation

You can integrate webgl-operate as bundled JavaScript in your HTML:

<script src="https://cdn.jsdelivr.net/npm/webgl-operate@latest/dist/webgl-operate.min.js"></script>

Or you can use webgl-operate as JavaScript or TypeScript library (types included) via npm:

npm install webgl-operate

Demos

The sources of each of the following demos are part of the webgl-operate repository, located in the demos directory.

CORNELL BOX

Progressive path tracing of the classic Cornell Box in GLSL for WebGL as well as WebGL2.

by cgcostume and chistopher

GLTF SUPPORT

glTF support with physical-based rendering and multi-frame sampling.

by bwasty and p-otto

coming soon

VOLUME VISUALIZER

Basic volume rendering using ray-marching with simple shading, coloring and more.

by tobi, sbusch42, and cgcostume

coming soon

OPENLL TEXT RENDERING

High-performance, text placement, typesetting, and rendering of in 2D and 3D.

by anne-gropler and cgcostume

PROGRESSIVE LIGHTING

PBR renderer showcasing different methods of physically plausible lighting.

by p-otto

POINT CLOUD

Particle rendering for interactive visual display of an animated point cloud.

by cgcostume

coming soon

2.5D TREEMAP

Interactive visualization of tree-structured, massive data for software analytics.

by cgcostume, bwasty, and scheibel

coming soon

METABALLS

Raymarched Metaballs with 3D force field, reflections, and some post processing.

by cgcostume and bwasty

LANDSCAPE OF CUBES

WebGL port of the initial glbinding cubescape demo using instanced rendering.

by cgcostume

coming soon

WEBXR SUPPORT

Simple demo showcasing how WebXR can be utilized with webgl-operate.

by bwasty

EYE TRACKER DEMO

Simple demo showing eye tracking.

by MartinBuessemeyer and cgcostume

Your WebGL Status

context.about:

 

Please refer to the Plain About Page when used for support.