remotion-dev/remotion · error · Error

Failed to create WebGL buffer

Error message

Failed to create WebGL buffer

What it means

Thrown in setupContourLines when gl.createBuffer() returns null. The WebGL2 context was acquired but could not allocate a buffer object for the vertex data. This is a GPU resource exhaustion or context-loss issue, not a user parameter problem.

Source

Thrown at packages/effects/src/contour-lines.ts:446

	gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);

	const program = createProgram(gl, CONTOUR_LINES_VS, CONTOUR_LINES_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 colorCanvas = document.createElement('canvas');
	colorCanvas.width = 1;
	colorCanvas.height = 1;
	const colorCtx = colorCanvas.getContext('2d', {willReadFrequently: true});

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Reduce the number of simultaneously active WebGL effects.
2. Check gl.isContextLost() before and during setup.
3. Use a rendering environment with adequate GPU resources.
4. Implement webglcontextlost handling to reinitialize.

// Verify WebGL2 context health before effect setup
const gl = target.getContext('webgl2');
if (gl?.isContextLost()) {
  // defer or skip
}

try {
  contourLines({...})(source, target);
} catch (e) {
  if (e instanceof Error && e.message === 'Failed to create WebGL buffer') {
    // GPU resource issue — reduce concurrent effects
  }
  throw e;
}

When it happens

Trigger: During contour-lines effect initialization, after VAO creation, gl.createBuffer() returns null when allocating the fullscreen-quad vertex buffer.

Common situations: GPU resource exhaustion from many simultaneous effects; context lost between VAO and buffer creation; constrained software WebGL in CI/VM/headless environments.

Related errors

• Failed to create WebGL shader
• Failed to create WebGL program
• Failed to create WebGL texture
• Failed to create WebGL vertex array
• Failed to create WebGL buffer

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