remotion-dev/remotion · critical · Error

Failed to create WebGL program

Error message

Failed to create WebGL program

What it means

A plain Error thrown by createProgram in the Liquid contours effect when gl.createProgram() returns null. Same contract as the Lines effect: WebGL2 may return null under resource exhaustion or context loss, after both shaders have already compiled.

Source

Thrown at packages/effects/src/liquid-contours.ts:305

	if (!shader) throw new Error('Failed to create WebGL shader');
	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(
			`Liquid contours shader compile failed: ${log ?? '(no log)'}`,
		);
	}

	return shader;
};

const createProgram = (gl: WebGL2RenderingContext): WebGLProgram => {
	const vs = compileShader(gl, gl.VERTEX_SHADER, VERTEX_SHADER);
	const fs = compileShader(gl, gl.FRAGMENT_SHADER, FRAGMENT_SHADER);
	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);
	gl.deleteShader(vs);
	gl.deleteShader(fs);
	if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
		const log = gl.getProgramInfoLog(program);
		gl.deleteProgram(program);
		throw new Error(
			`Liquid contours program link failed: ${log ?? '(no log)'}`,
		);
	}

	return program;
};

const setup = (target: HTMLCanvasElement): LiquidContoursState => {
	const gl = target.getContext('webgl2', {

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Lower render concurrency / parallel browser pages.
2. Ensure prior effects are disposed so programs are reclaimed.
3. Render on a host with adequate GPU memory / a stable GL backend.

function canAllocateProgram(): boolean {
  const c = document.createElement('canvas');
  const gl = c.getContext('webgl2');
  if (!gl) return false;
  return !!gl.createProgram();
}

try {
  liquidContours(...);
} catch (err) {
  if (err instanceof Error && /WebGL program/.test(err.message)) {
    // reduce concurrency, restart context, then retry
  } else throw err;
}

When it happens

Trigger: WebGL2 context is alive but cannot allocate a program object — GPU memory exhaustion, too many programs, or a lost context. Reached after compileShader succeeds for both vertex and fragment shaders.

Common situations: Heavy concurrent rendering; GL object leaks across effects/contexts; constrained headless GL; a transient context-loss race.

Related errors

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

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