remotion-dev/remotion · critical · Error

Failed to create WebGL buffer

Error message

Failed to create WebGL buffer

What it means

Thrown by setupWaves() when gl.createBuffer() returns null. The buffer holds the fullscreen-quad vertex data (interleaved position + UV, 16 bytes per vertex). createBuffer returns null on context loss, context destruction, or resource exhaustion.

Source

Thrown at packages/effects/src/waves.ts:461

	gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);

	const program = createProgram(gl, WAVES_VS, WAVES_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. Handle 'webglcontextlost'/'webglcontextrestored' and recreate the effect on a new canvas.
2. Ensure cleanup of old waves effect states (cleanup deletes the buffer) before creating new instances.
3. Reduce concurrent effect canvases to lower buffer object pressure.
4. Recycle render worker processes between heavy jobs.

try {
  const state = setupWaves(canvas);
} catch (e) {
  if ((e as Error).message === 'Failed to create WebGL buffer') {
    console.warn('Waves buffer allocation failed:', (e as Error).message);
  }
}

When it happens

Trigger: Called from setupWaves() at packages/effects/src/waves.ts:459 after the VAO is created and bound. Fires when the GL context cannot allocate a buffer object — typically context loss or buffer object pool exhaustion after VAO and program creation already succeeded.

Common situations: Context loss during setup; many concurrent effects without cleanup leaking buffer objects; long-running renders; constrained GPU environments.

Related errors

• Failed to create WebGL buffer
• Failed to create WebGL buffer
• Failed to create WebGL buffer
• Failed to create WebGL buffer
• Failed to create WebGL buffer

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