remotion-dev/remotion · error · Error

Failed to create WebGL geometry

Error message

Failed to create WebGL geometry

What it means

In setupSkew() the skew() effect calls gl.createVertexArray() and gl.createBuffer() to hold its fullscreen-quad geometry; if either returns null it throws 'Failed to create WebGL geometry'. A null VAO or VBO means the context is lost or out of geometry resources, so the effect has nowhere to upload its vertex data.

Source

Thrown at packages/effects/src/skew.ts:210

	if (!program) {
		throw new Error('Failed to create WebGL program');
	}

	gl.attachShader(program, vertexShader);
	gl.attachShader(program, fragmentShader);
	gl.linkProgram(program);
	gl.deleteShader(vertexShader);
	gl.deleteShader(fragmentShader);
	if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
		const log = gl.getProgramInfoLog(program);
		gl.deleteProgram(program);
		throw new Error(`Skew program link failed: ${log ?? '(no log)'}`);
	}

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

	gl.bindVertexArray(vao);
	gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
	gl.bufferData(
		gl.ARRAY_BUFFER,
		new Float32Array([-1, -1, 0, 0, 1, -1, 1, 0, -1, 1, 0, 1, 1, 1, 1, 1]),
		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 texture = gl.createTexture();

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Render with ANGLE (--gl=angle / chromiumOptions.gl='angle' / Studio OpenGL=angle).
2. Cut concurrency and/or the number of WebGL2 effects per frame to free VAO/VBO slots.
3. Confirm the effect cleanup path (deleteVertexArray/deleteBuffer) actually runs so resources are reclaimed.
4. Use a host with a conformant GPU and current drivers.

Example fix

// before
npx remotion render main MyComp out.mp4 --concurrency=16

// after
npx remotion render main MyComp out.mp4 --concurrency=4 --gl=angle

// A null VAO/VBO is a context-loss/resource symptom; only generic WebGL2 capability is pre-checkable.
function webgl2Available(): boolean {
  try {
    return !!document.createElement('canvas').getContext('webgl2');
  } catch {
    return false;
  }
}

try {
  await renderMedia({ composition, codec: 'h264', chromiumOptions: { gl: 'angle' }, concurrency: 4 });
} catch (err) {
  if (err instanceof Error && /Failed to create WebGL geometry/.test(err.message)) {
    console.error('skew() VAO/VBO allocation failed (context lost/exhausted). Reduce concurrency/effects.', err);
    throw err;
  }
  throw err;
}

When it happens

Trigger: Context loss or buffer/VAO exhaustion immediately after program linking in setupSkew(); exceeding the driver's bound on simultaneous vertex array objects or buffers because many WebGL2 effects are live at once.

Common situations: High render concurrency with numerous stacked WebGL2 effects; long renders leaking VAOs/VBOs; headless or software-GPU environments with tight resource caps; driver reset mid-setup.

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 shader

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