remotion-dev/remotion · error · Error

Failed to create WebGL texture

Error message

Failed to create WebGL texture

What it means

The final allocation in the speckle() setup is gl.createTexture() for the source sampler; if it returns null the effect throws 'Failed to create WebGL texture'. Without a texture handle speckle cannot receive the input frame, so setup aborts. Like the other speckle allocation errors, this reflects a lost/exhausted context rather than a parameter problem.

Source

Thrown at packages/effects/src/speckle.ts:259

		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'),
			uDensity: gl.getUniformLocation(program, 'uDensity'),

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Use ANGLE (--gl=angle / chromiumOptions.gl='angle' / Studio OpenGL=angle) for more reliable texture allocation.
  2. Reduce render concurrency, the number of WebGL2 effects, or output resolution to ease texture memory pressure.
  3. Ensure gl.deleteTexture runs on cleanup so textures are recycled.
  4. Render on a host with adequate GPU memory and supported drivers.

Example fix

// before
await renderMedia({ composition, serveUrl, chromiumOptions: {} });
// after
await renderMedia({ composition, serveUrl, chromiumOptions: { gl: 'angle' } });
Defensive patterns

Strategy: try-catch

Validate before calling

function webgl2Available(): boolean {
  try {
    return !!document.createElement('canvas').getContext('webgl2');
  } catch {
    return false;
  }
}

Try / catch

try {
  await renderMedia({ composition, codec: 'h264', chromiumOptions: { gl: 'angle' } });
} catch (err) {
  if (err instanceof Error && /Failed to create WebGL texture/.test(err.message)) {
    console.error('speckle() texture allocation failed (context lost/GPU memory pressure). Lower resolution or concurrency.', err);
    throw err;
  }
  throw err;
}

Prevention

When it happens

Trigger: Context loss or texture-memory exhaustion at the tail of the speckle setup; reaching a driver-imposed texture-object limit with many live WebGL2 effects; GPU memory pressure from large output resolutions times many effects.

Common situations: Many parallel high-resolution renders each stacking multiple WebGL2 effects; software GPUs with low texture memory; driver crash/reset; leaked textures from effects whose cleanup never ran.

Related errors


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