remotion-dev/remotion · error · Error

Failed to create WebGL texture

Error message

Failed to create WebGL texture

What it means

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

Source

Thrown at packages/effects/src/skew.ts:230

	gl.bindVertexArray(vao);
	gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
	gl.bufferData(
		gl.ARRAY_BUFFER,
		new Float32Array([-1, -1, 0, 0, 1, -1, 1, 0, -1, 1, 0, 1, 1, 1, 1, 1]),
		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'),
		uSkew: gl.getUniformLocation(program, 'uSkew'),

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Force ANGLE (--gl=angle / chromiumOptions.gl='angle' / Studio OpenGL=angle) for more dependable texture allocation.
2. Lower render concurrency and reduce simultaneous WebGL2 effects or output resolution to ease texture memory pressure.
3. Ensure gl.deleteTexture runs on cleanup so textures are recycled between effect instances.
4. Render on a machine with adequate GPU memory and supported drivers.

Example fix

// before
await renderMedia({ composition, serveUrl, chromiumOptions: {} });

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

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

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('skew() texture allocation failed (context lost/GPU memory pressure). Lower resolution or concurrency.', err);
    throw err;
  }
  throw err;
}

When it happens

Trigger: Context loss or texture-memory exhaustion at the tail of setupSkew(); hitting a driver-imposed texture-object limit with many live WebGL2 effects; GPU memory pressure from large frame resolutions times many effects.

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

Related errors

• Failed to create WebGL texture
• Failed to create WebGL texture
• Failed to create WebGL texture
• Failed to create WebGL noise texture
• Failed to create WebGL shader

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