remotion-dev/remotion · critical · Error

Failed to create WebGL texture

Error message

Failed to create WebGL texture

What it means

Thrown by `createRgbaTexture` in the blur runtime when `gl.createTexture()` returns `null`. Blur needs two RGBA textures (source + intermediate), so texture exhaustion is more likely than single-texture effects. A null handle is an environmental/resource failure.

Source

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

	const program = linkProgram(gl, vs, fs);
	gl.deleteShader(vs);
	gl.deleteShader(fs);
	return program;
};

const getBlurUniforms = (
	gl: WebGL2RenderingContext,
	program: WebGLProgram,
): BlurState['horizontal'] => ({
	uRadius: gl.getUniformLocation(program, 'uRadius'),
	uTexelSize: gl.getUniformLocation(program, 'uTexelSize'),
	uSource: gl.getUniformLocation(program, 'uSource'),
});

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

export const setupBlur = (target: HTMLCanvasElement): BlurState => {
	const gl = target.getContext('webgl2', {
		premultipliedAlpha: true,
		alpha: true,
		preserveDrawingBuffer: true,
	});
	if (!gl) {

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Call `cleanupBlur` to release textures when a blur effect is no longer needed.
2. Reduce concurrently active blur effects or lower frame resolution.
3. Check `gl.isContextLost()` and reinitialize on restore.
4. Verify hardware-accelerated WebGL2 and update drivers.

Example fix

// before: leak states
setupBlur(canvas);

// after: clean up
cleanupBlur(state);

if (gl.isContextLost()) { /* skip setupBlur */ }

try {
  const state = setupBlur(canvas);
} catch (err) {
  if (/Failed to create WebGL texture/.test(err.message)) {
    // reduce effects or await restore, then retry
  } else { throw err; }
}

When it happens

Trigger: Fires at line 98-99 from `setupBlur` -> `createRgbaTexture(gl)`, called twice (textureSource and textureIntermediate).

Common situations: Many live blur effects holding intermediate textures; large frame dimensions inflating texture memory; context loss; constrained software renderer.

Related errors

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

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