remotion-dev/remotion · critical · Error

Failed to create WebGL program

Error message

Failed to create WebGL program

What it means

Thrown from linearGradientTint setup when `gl.createProgram()` returns null. Both shaders already compiled successfully; null only happens on context loss, OUT_OF_MEMORY, or program-handle exhaustion.

Source

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

	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(
			`Linear gradient tint 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(
			`Linear gradient tint program link failed: ${log ?? '(no log)'}`,
		);
	}

	return program;
};

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Reuse cached setup keyed by params; pair setup with cleanup.
2. Recover from `webglcontextlost` and rebuild on restore.
3. Limit concurrent WebGL effects per canvas.
4. Restart workers that accumulate GL handles.

const contextHealthy = (gl: WebGL2RenderingContext | null): boolean =>
  !!gl && !gl.isContextLost();

const isHealthyContext = (gl: WebGL2RenderingContext | null): gl is WebGL2RenderingContext =>
  !!gl && !gl.isContextLost();

canvas.addEventListener('webglcontextlost', (e) => e.preventDefault());
try {
  setupLinearGradientTint(canvas);
} catch (err) {
  renderWithoutEffect();
}

When it happens

Trigger: Setup invoked on an already-lost context; many programs allocated in one session exhausting handles; OOM spike after successful shader compile.

Common situations: Long-lived workers that leak programs; many stacked effects; flaky GPU on headless Chromium.

Related errors

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

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