remotion-dev/remotion · error · Error

Failed to create WebGL program

Error message

Failed to create WebGL program

What it means

Thrown by the linkProgram() helper of the halftone effect when gl.createProgram() returns null. As with other null-resource returns, this indicates object-budget exhaustion or context loss; no program could be created to attach shaders to.

Source

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

	gl.shaderSource(shader, source);
	gl.compileShader(shader);
	if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
		const log = gl.getShaderInfoLog(shader);
		gl.deleteShader(shader);
		throw new Error(`Halftone shader compile failed: ${log ?? '(no log)'}`);
	}

	return shader;
};

const linkProgram = (
	gl: WebGL2RenderingContext,
	vs: WebGLShader,
	fs: WebGLShader,
): WebGLProgram => {
	const program = gl.createProgram();
	if (!program) {
		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(`Halftone program link failed: ${log ?? '(no log)'}`);
	}

	return program;
};

// Halftone effect (WebGL2). Converts luminance into a grid of dots, squares,
// or lines. Each fragment determines its nearest grid cell and whether it falls
// inside a dot, so edge dots are never culled. `dotSpacing` sets the grid pitch
// (defaults to `dotSize`). `sampling` controls texture interpolation when

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Check gl.isContextLost(); restart the render if true.
  2. Reduce simultaneous WebGL2 effect count or share effect state.
  3. Render on a machine with more GPU/driver headroom.
  4. Restart Chrome/Studio to clear leaked GL objects.
Defensive patterns

Strategy: try-catch

Validate before calling

// Probe whether the context still hands out program objects.
function canCreateProgram(canvas: HTMLCanvasElement): boolean {
  const gl = canvas.getContext('webgl2');
  if (!gl) return false;
  const p = gl.createProgram();
  const ok = p !== null;
  if (p) gl.deleteProgram(p);
  return ok;
}

Try / catch

try {
  // ...use halftone()
} catch (e) {
  if (e instanceof Error && /Failed to create WebGL program/.test(e.message)) {
    // program object budget exhausted or context lost; restart render
  } else throw e;
}

Prevention

When it happens

Trigger: setup() of the halftone effect running under GL object-budget pressure or after context loss; specifically the shaders compiled but the program pool is exhausted.

Common situations: Heavy compositions with many WebGL2 effects; long render sessions; GPU process crash leaving the context degraded.

Related errors


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