remotion-dev/remotion · error · Error

Failed to create WebGL texture

Error message

Failed to create WebGL texture

What it means

Thrown in setup() of the halftone effect when gl.createTexture() returns null. The effect allocates one source texture to receive each incoming frame; null means the GL implementation refused another texture object — texture-budget limits or context loss.

Source

Thrown at packages/effects/src/halftone.ts:458

		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.bindTexture(gl.TEXTURE_2D, null);

		const colorCanvas = document.createElement('canvas');
		colorCanvas.width = 1;
		colorCanvas.height = 1;
		const colorCtx = colorCanvas.getContext('2d', {willReadFrequently: true});
		if (!colorCtx) {
			throw new Error('Failed to acquire 2D context for color parsing');
		}

		return {
			gl,
			program,

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Check gl.isContextLost(); restart the render if true.
  2. Reduce media-layer count feeding WebGL2 effects or lower output resolution.
  3. Render on hardware with adequate texture memory; avoid pure-software GL for large frames.
  4. Update the GPU driver.
Defensive patterns

Strategy: try-catch

Validate before calling

function canCreateTexture(canvas: HTMLCanvasElement, width: number, height: number): boolean {
  const gl = canvas.getContext('webgl2');
  if (!gl) return false;
  const tex = gl.createTexture();
  if (!tex) return false;
  gl.bindTexture(gl.TEXTURE_2D, tex);
  try {
    gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
  } catch {
    gl.deleteTexture(tex);
    return false;
  }
  gl.deleteTexture(tex);
  return true;
}

Try / catch

try {
  // ...use halftone()
} catch (e) {
  if (e instanceof Error && /Failed to create WebGL texture/.test(e.message)) {
    // reduce resolution / media layers, or restart on context loss
  } else throw e;
}

Prevention

When it happens

Trigger: Allocating the halftone source texture alongside many other live textures; very large frame dimensions on a GPU with low texture memory; context-lost state.

Common situations: Compositions with many media layers feeding WebGL2 effects; headless software GL with stingy texture limits; rendering after a GPU crash.

Related errors


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