remotion-dev/remotion · critical · Error

Failed to create WebGL texture

Error message

Failed to create WebGL texture

What it means

Thrown by createSourceTexture (packages/effects/src/paper.ts:696) when gl.createTexture() returns null while creating the source texture the paper effect uploads each frame into. Null indicates a lost WebGL2 context, GPU-memory exhaustion, or too many live textures.

Source

Thrown at packages/effects/src/paper.ts:696

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

	return program;
};

const createSourceTexture = (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 initialNoiseState = (seed: number): number => {
	const scaledSeed = Math.round(seed * 1000);
	const mixedState = (0x9e3779b9 ^ Math.imul(scaledSeed, 0x85ebca6b)) >>> 0;
	return mixedState === 0 ? 0x9e3779b9 : mixedState;
};

const nextNoiseState = (state: number): number => {

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Dispose textures via cleanup between compositions and cap concurrent WebGL2 effects.
2. Render on a GPU host with WebGL enabled in headless Chrome.
3. Handle context-loss events and re-render after restore; fall back to no-effect render if allocation keeps failing.

Example fix

// before
const sourceTexture = createSourceTexture(gl); // createTexture() returned null

// after
if (gl.isContextLost()) {
  throw new Error('WebGL2 context lost; cannot create paper source texture');
}

function canCreatePaperSourceTexture(): boolean {
  try {
    const c = document.createElement('canvas');
    const gl = c.getContext('webgl2');
    if (!gl || gl.isContextLost()) return false;
    const t = gl.createTexture();
    const ok = !!t;
    if (t) gl.deleteTexture(t);
    return ok;
  } catch {
    return false;
  }
}

try {
  scene.push(paper({amount: 1}));
} catch (err) {
  if (/Failed to create WebGL texture/.test(String(err?.message))) {
    // texture budget exhausted or context lost: omit the effect
  } else throw err;
}

When it happens

Trigger: setupPaper creating the source texture on a lost context or under GPU-memory pressure; many texture-allocating effects running concurrently; very large render dimensions.

Common situations: Integrated GPUs with low texture memory; leaked textures in long sessions; headless software rendering; GPU crash mid-batch.

Related errors

• Failed to create WebGL noise texture
• Failed to create WebGL texture
• Failed to create WebGL texture
• 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/5ac7e01ad070faa4. Report an issue: GitHub.