remotion-dev/remotion · critical · Error

Failed to create WebGL texture

Error message

Failed to create WebGL texture

What it means

Thrown when `gl.createTexture()` returns null while creating the source texture for linearGradientTint. Per-spec failure means context loss, OUT_OF_MEMORY, or texture-handle exhaustion — most often caused by leaking textures across repeated setups.

Source

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

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

const createRgbaTexture = (gl: WebGL2RenderingContext): WebGLTexture => {
	const texture = gl.createTexture();
	if (!texture) {
		throw new Error('Failed to create WebGL texture');
	}

	gl.bindTexture(gl.TEXTURE_2D, texture);
	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
	gl.bindTexture(gl.TEXTURE_2D, null);
	return texture;
};

const setupLinearGradientTint = (
	target: HTMLCanvasElement,
): LinearGradientTintState => {
	const gl = target.getContext('webgl2', {
		premultipliedAlpha: true,
		alpha: true,
		preserveDrawingBuffer: true,

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Always pair setup with the effect's cleanup function so textures are freed.
2. Cache setup keyed by params and reuse it.
3. Recover on `webglcontextlost`; rebuild on restore.
4. Cap concurrent WebGL effects per worker.

useEffect(() => {
  let state = null;
  try { state = setupLinearGradientTint(canvas); } catch { state = null; }
  return () => { if (state) cleanupLinearGradientTint(state); };
}, []);

When it happens

Trigger: Repeated setup without matching cleanup; setup on a lost context; many effects each leaking a texture.

Common situations: Hot-reload loops in Studio that re-setup; long Lambda sessions accumulating textures; forgetting cleanup in a custom hook.

Related errors

• Failed to create WebGL texture
• Failed to create WebGL shader
• Linear gradient tint shader compile failed: ${log ?? '(no lo
• Failed to create WebGL program
• Linear gradient tint program link failed: ${log ?? '(no log)

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