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.

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.

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

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;
  }
}

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

• Failed to create WebGL buffer
• Failed to create WebGL shader
• Failed to create WebGL texture
• Failed to create WebGL vertex array
• Program link failed

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

Appendix: 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)