MiniMax-AI/skills · error · Error

WebGL2 not supported

Error message

WebGL2 not supported

What it means

`throw new Error('WebGL2 not supported')` in the fluid-simulation technique doc after `canvas.getContext("webgl2")` returns null. `getContext` yields null (rather than throwing) when the browser cannot provide a WebGL2 context. The technique first injects a fallback HTML message, then throws so dependent simulation init never runs on an incapable browser.

Source

Thrown at skills/shader-dev/techniques/fluid-simulation.md:113

gl.uniform4f(uMouse, iMouse[0], iMouse[1], iMouse[2], 0.0);
// IMPORTANT: Mouse velocity must be clamped, otherwise fast dragging produces huge velocity deltas causing NaN explosion
const mvx = Math.max(-50, Math.min(50, iMouse[0] - prevMouse[0]));
const mvy = Math.max(-50, Math.min(50, iMouse[1] - prevMouse[1]));
gl.uniform2f(uMouseVel, mvx, mvy);
```

### Handling WebGL 2 Unavailability

```javascript
const gl = canvas.getContext("webgl2");
if (!gl) {
    document.body.innerHTML = `
        <div style="color:#fff;padding:20px;font-family:sans-serif;">
            <h2>WebGL 2 Not Supported</h2>
            <p>Fluid simulation requires WebGL 2. Please use a modern browser (Chrome 56+, Firefox 51+, Safari 15+).</p>
        </div>
    `;
    throw new Error('WebGL2 not supported');
}
```

# Real-Time Fluid Simulation

## Use Cases
- Real-time 2D fluid effects in ShaderToy/WebGL (smoke, liquids, ink diffusion)
- Interactive fluid: mouse/touch-driven fluid response
- **Ink diffusion/curling vortex effects in water**: vorticity confinement + high diffusion coefficient + single or multi-color ink
- **Multi-color ink mixing**: multiple ink colors interpenetrating and blending (requires Buffer B to store RGB ink, see multi-color ink mixing template)
- Decorative fluid backgrounds, particle systems, vortex visualization
- **Lava/fire/magma effects**: fluid simulation + FBM noise texture + temperature color mapping
- **Water surface ripple effects**: wave equation + click-generated concentric ripples + interference and damping
- Core: solving simplified Navier-Stokes equations or wave equations in GPU fragment shaders

## Core Principles

Incompressible Navier-Stokes equation discretization:

View on GitHub (pinned to 60aaae52bb)

Solutions

1. Use a WebGL2-capable browser: Chrome 56+, Firefox 51+, or Safari 15+.
2. Enable hardware acceleration in the browser settings and update GPU drivers.
3. For headless/CI, run with a software GL implementation (e.g. SwiftShader) or skip the GL code path.
4. Guard the entry point and show a graceful fallback rather than letting the throw crash the page.

Example fix

// before
const gl = canvas.getContext("webgl2");
if (!gl) { document.body.innerHTML = fallback; throw new Error('WebGL2 not supported'); }

// after — degrade gracefully without throwing
const gl = canvas.getContext("webgl2");
if (!gl) { renderStaticFallback(); return; }
startSimulation(gl);

const gl = canvas.getContext('webgl2');
if (!gl) {
  // capability check before any GL work
  renderStaticFallback();
  return; // do NOT throw
}

function supportsWebGL2(): boolean {
  try {
    const c = document.createElement('canvas');
    return !!c.getContext('webgl2');
  } catch { return false; }
}

try {
  const gl = canvas.getContext('webgl2');
  if (!gl) throw new Error('WebGL2 not supported');
  startSimulation(gl);
} catch (e) {
  if (e instanceof Error && /WebGL2/i.test(e.message)) {
    renderStaticFallback();
  } else throw e;
}

When it happens

Trigger: Running the page in a browser/GPU combo without WebGL2: older Safari (<15), a blacklisted GPU/driver, hardware acceleration disabled in the browser settings, a headless or software-rendered environment, or the context being lost/exhausted.

Common situations: Testing in an old Safari, running in a VM/CI without GPU acceleration, users with hardware acceleration turned off, or devices with denylisted graphics drivers.

Related errors

• WebGL2 not supported
• No WebGL2

AI-assisted analysis of MiniMax-AI/skills@60aaae52bb (2026-08-13). Data as JSON: /api/errors/d8084112e0394959. Report an issue: GitHub.