remotion-dev/remotion · error · Error

Failed to create WebGL texture

Error message

Failed to create WebGL texture

What it means

The shrinkwrap() effect's setup function calls gl.createTexture() to allocate the source texture for the input frame. If the WebGL2 driver returns null, the effect throws this Error. Texture allocation failure typically indicates VRAM exhaustion, especially likely given the shrinkwrap shader's memory-intensive operations.

Source

Thrown at packages/effects/src/shrinkwrap.ts:496

		if (!vbo) {
			throw new Error('Failed to create WebGL buffer');
		}

		gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
		gl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);

		const aPos = gl.getAttribLocation(program, 'aPos');
		const aUv = gl.getAttribLocation(program, 'aUv');
		gl.enableVertexAttribArray(aPos);
		gl.vertexAttribPointer(aPos, 2, gl.FLOAT, false, 16, 0);
		gl.enableVertexAttribArray(aUv);
		gl.vertexAttribPointer(aUv, 2, gl.FLOAT, false, 16, 8);

		gl.bindVertexArray(null);

		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_WRAP_S, gl.CLAMP_TO_EDGE);
		gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
		gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
		gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
		gl.bindTexture(gl.TEXTURE_2D, null);

		return {
			gl,
			program,
			vao,
			vbo,
			texture,
			uSource: gl.getUniformLocation(program, 'uSource'),
			uResolution: gl.getUniformLocation(program, 'uResolution'),
			uAmount: gl.getUniformLocation(program, 'uAmount'),

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Reduce output resolution to lower per-frame texture memory requirements.
2. Lower concurrency so fewer effect textures are live simultaneously.
3. Ensure GPU hardware acceleration is active.
4. Use a host with adequate VRAM for the target resolution.

Example fix

null

// Probe texture allocation capability
function canCreateTexture(canvas: HTMLCanvasElement): boolean {
  const gl = canvas.getContext('webgl2');
  if (!gl) return false;
  const tex = gl.createTexture();
  const ok = tex !== null;
  if (tex) gl.deleteTexture(tex);
  return ok;
}

null

try {
  shrinkwrap({ amount: 1 });
} catch (e) {
  if (e instanceof Error && e.message === 'Failed to create WebGL texture') {
    console.warn('WebGL2 texture allocation failed — try reducing resolution or concurrency');
  } else {
    throw e;
  }
}

When it happens

Trigger: Calling shrinkwrap() when the GPU cannot allocate a texture — VRAM exhaustion from large frame sizes, many concurrent effects each holding textures, or a software renderer with hard texture memory limits. The shrinkwrap effect's complex shader compounds memory pressure.

Common situations: High-resolution renders (4K+) that exceed software renderer texture caps; many concurrent effect instances each with their own texture; SwiftShader/llvmpipe backends with limited texture memory; context-loss invalidating previously allocated resources.

Related errors

• Failed to create WebGL texture
• Failed to create WebGL texture
• Failed to create WebGL texture
• Failed to create WebGL texture
• Failed to create WebGL texture

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