remotion-dev/remotion · critical · Error

Failed to create WebGL buffer

Error message

Failed to create WebGL buffer

What it means

During starburst effect `setup`, `gl.createBuffer()` returned `null` while allocating the vertex buffer for the fullscreen quad. This indicates the GL context cannot allocate a buffer object, usually due to context loss or resource exhaustion. The VAO has already been created and bound when this fires.

Solutions

  1. Reduce concurrent webgl2 effect instances.
  2. Restart the session to obtain a fresh context.
  3. Ensure adequate GPU memory is available (close other GPU-heavy apps).
  4. Handle `webglcontextlost` events and reinitialize effect state.
Defensive patterns

Strategy: fallback

Try / catch

try {
  starburst({...params});
} catch (e) {
  if (/Failed to create WebGL buffer/.test((e as Error).message)) {
    renderFallbackFrame();
  } else throw e;
}

Prevention

When it happens

Trigger: Context lost after VAO creation; GPU memory for buffer objects exhausted; degraded/destroyed GL context.

Common situations: Many concurrent webgl2 effects; memory-constrained mobile devices; long-running sessions; headless CI with limited GL memory.

Related errors


AI-assisted analysis of remotion-dev/remotion@78fe4bb3fd (2026-08-12). Data as JSON: /api/errors/f628639d396dabee. Report an issue: GitHub.

Appendix: source

Thrown at packages/effects/src/starburst.ts:314

		const fs = compileShader(gl, gl.FRAGMENT_SHADER, STARBURST_FS);
		const program = linkProgram(gl, vs, fs);
		gl.deleteShader(vs);
		gl.deleteShader(fs);

		const vao = gl.createVertexArray();
		if (!vao) {
			throw new Error('Failed to create WebGL vertex array');
		}

		gl.bindVertexArray(vao);

		const data = new Float32Array([
			-1, -1, 0, 0, 1, -1, 1, 0, -1, 1, 0, 1, 1, 1, 1, 1,
		]);

		const vbo = gl.createBuffer();
		if (!vbo) {
			throw new Error('Failed to create WebGL buffer');
		}

		gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
		gl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);

		const aPos = gl.getAttribLocation(program, 'aPos');
		const aUv = gl.getAttribLocation(program, 'aUv');
		gl.enableVertexAttribArray(aPos);
		gl.vertexAttribPointer(aPos, 2, gl.FLOAT, false, 16, 0);
		gl.enableVertexAttribArray(aUv);
		gl.vertexAttribPointer(aUv, 2, gl.FLOAT, false, 16, 8);

		gl.bindVertexArray(null);

		const paletteTexture = gl.createTexture();
		if (!paletteTexture) {
			throw new Error('Failed to create WebGL palette texture');
		}

View on GitHub (pinned to 78fe4bb3fd)