remotion-dev/remotion · critical · Error

Failed to create WebGL program

Error message

Failed to create WebGL program

What it means

During zoomBlur setup, `gl.createProgram()` returned `null`, meaning the WebGL2 context could not allocate a program object. Like the shader creation failure, this indicates context loss or severe GPU resource exhaustion rather than a user-facing parameter problem.

Source

Thrown at packages/effects/src/zoom-blur/zoom-blur-runtime.ts:49

	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(`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(`Program link failed: ${log ?? '(no log)'}`);
	}

	return program;
};

const createProgram = (
	gl: WebGL2RenderingContext,
	vertexSource: string,
	fragmentSource: string,

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Reduce the number of concurrent WebGL effects.
  2. Ensure the canvas and context are not destroyed or lost before effect setup.
  3. Handle `webglcontextlost` and recreate the context and effect state.
  4. Update GPU drivers or use a more capable GPU.
Defensive patterns

Strategy: try-catch

Validate before calling

const testGl = document.createElement('canvas').getContext('webgl2');
if (!testGl) {
  // WebGL2 not available; avoid zoomBlur
}

Try / catch

try {
  zoomBlur({ amount: 40 });
} catch (err) {
  if (err instanceof Error && err.message.includes('WebGL program')) {
    console.error('WebGL program creation failed:', err.message);
  } else {
    throw err;
  }
}

Prevention

When it happens

Trigger: WebGL2 context lost or destroyed before the effect setup completes, GPU memory exhausted by other contexts or effects, or a driver in a degraded state.

Common situations: Many concurrent WebGL compositions in one render, context loss after GPU reset, rendering in an environment with limited GPU memory, or a browser tab that was backgrounded and had its context reclaimed.

Related errors


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