remotion-dev/remotion · error · Error

Failed to create WebGL program

Error message

Failed to create WebGL program

What it means

The shrinkwrap() effect's linkProgram helper calls gl.createProgram() during setup. If the WebGL2 driver returns null, the effect throws this generic Error. The context was created successfully but cannot allocate a program object, indicating extreme GPU resource exhaustion or a degraded/lost context.

Source

Thrown at packages/effects/src/shrinkwrap.ts:424

	gl.shaderSource(shader, source);
	gl.compileShader(shader);
	if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
		const log = gl.getShaderInfoLog(shader);
		gl.deleteShader(shader);
		throw new Error(`Shrinkwrap shader compile failed: ${log ?? '(no log)'}`);
	}

	return shader;
};

const linkProgram = (
	gl: WebGL2RenderingContext,
	vs: WebGLShader,
	fs: WebGLShader,
): WebGLProgram => {
	const program = gl.createProgram();
	if (!program) {
		throw new Error('Failed to create WebGL program');
	}

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

	return program;
};

export const shrinkwrap = createEffect<ShrinkwrapParams, ShrinkwrapState>({
	type: 'dev.remotion.effects.shrinkwrap',
	label: 'shrinkwrap()',
	documentationLink: 'https://www.remotion.dev/docs/effects/shrinkwrap',

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Reduce render concurrency to limit the number of live WebGL2 program objects.
2. Ensure the effect cleanup lifecycle runs properly — cleanup() calls gl.deleteProgram().
3. Verify GPU acceleration in the render environment.
4. Retry after confirming context health (no 'webglcontextlost' event).

Example fix

null

// Probe whether the WebGL2 context can allocate a program object
function canCreateProgram(canvas: HTMLCanvasElement): boolean {
  const gl = canvas.getContext('webgl2');
  if (!gl) return false;
  const program = gl.createProgram();
  const ok = program !== null;
  if (program) gl.deleteProgram(program);
  return ok;
}

null

try {
  shrinkwrap({ amount: 1 });
} catch (e) {
  if (e instanceof Error && e.message === 'Failed to create WebGL program') {
    console.warn('WebGL2 program allocation failed for shrinkwrap');
  } else {
    throw e;
  }
}

When it happens

Trigger: Calling shrinkwrap() when the WebGL2 context is under severe resource pressure — too many live program objects across effect instances, GPU memory exhaustion, or a context-loss event between getContext and createProgram.

Common situations: High-concurrency renders creating many simultaneous WebGL2 programs; software rendering backends with hard object limits; leaked program objects from prior effect instances that bypassed cleanup; transient context loss during setup.

Related errors

• Failed to create WebGL program
• Failed to create shadows and highlights vertex buffer
• Failed to create WebGL buffer
• Failed to create WebGL texture
• Failed to create WebGL buffer

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