remotion-dev/remotion · error · Error

Failed to create WebGL vertex array

Error message

Failed to create WebGL vertex array

What it means

Thrown by setupLinearGradient() when gl.createVertexArray() returns null after the program was built. The library needs a VAO to bind the fullscreen-quad attributes, so it aborts rather than silently drawing nothing.

Source

Thrown at packages/effects/src/linear-gradient.ts:227

};

const setupLinearGradient = (
	target: HTMLCanvasElement,
): LinearGradientState => {
	const gl = target.getContext('webgl2', {
		premultipliedAlpha: true,
		alpha: true,
		preserveDrawingBuffer: true,
	});
	if (!gl) {
		throw createWebGL2ContextError('linear gradient effect');
	}

	const program = createProgram(gl);

	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');

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Restart the render worker / Chrome to recover a clean context and retry.
  2. Lower `--concurrency` or framesPerLambda so fewer GL objects are live at once.
  3. Force software rendering (`--gl=angle --angle-backend=swiftshader`).
  4. Monitor host memory during the render; raise Lambda memory if the GPU process is being OOM-killed.
  5. Update GPU drivers / Chrome on persistent failures.
Defensive patterns

Strategy: retry

Validate before calling

function canAllocateVao(canvas: HTMLCanvasElement): boolean {
  const gl = canvas.getContext('webgl2');
  if (!gl) return false;
  const vao = gl.createVertexArray();
  const ok = vao !== null;
  if (vao) gl.deleteVertexArray(vao);
  return ok;
}

Try / catch

try {
  renderWithLinearGradient();
} catch (err) {
  if (err instanceof Error && err.message === 'Failed to create WebGL vertex array') {
    await restartRendererWorker();
    renderWithLinearGradient();
  } else throw err;
}

Prevention

When it happens

Trigger: WebGL2 context is alive but refused a VAO allocation — context on the verge of loss, driver VAO-object limit reached, or a GPU process that crashed and left allocations failing. Distinct from a context-creation failure (that throws createWebGL2ContextError earlier).

Common situations: High concurrency renders where many effects each create VAOs; long-lived Studio sessions; GPU memory pressure on integrated graphics; headless Chrome whose GPU process was killed by the OS OOM-killer.

Related errors


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