remotion-dev/remotion · critical · Error

Shader compile failed

Error message

Shader compile failed: ${log ?? '(no log)'}

What it means

The zoomBlur fragment or vertex shader failed to compile. The GLSL source is a hardcoded constant internal to the library, so a compile failure usually indicates a GPU driver bug or a WebGL2 implementation that rejects valid GLSL ES 3.00. The info log from the driver is included in the error message.

Solutions

1. Update the GPU driver or the headless browser's GPU support (e.g., update Chrome/SwiftShader).
2. Test on a different machine or GPU to confirm it is driver-specific.
3. Report the issue to Remotion with the shader info log from the error message.
4. On CI, ensure the Docker image includes a working GL stack (e.g., appropriate mesa/libGL packages).

try {
  zoomBlur({ amount: 40 });
} catch (err) {
  if (err instanceof Error && err.message.startsWith('Shader compile failed')) {
    // log the driver info and fall back to a different effect or skip
    console.error('Shader compile failed on this GPU:', err.message);
  } else {
    throw err;
  }
}

When it happens

Trigger: The shader sources (ZOOM_BLUR_VS / ZOOM_BLUR_FS) contain GLSL that a particular driver cannot parse, or the driver's shader compiler has a bug. Since the shaders are fixed, this is environmental rather than caused by user parameters.

Common situations: Rendering on older mobile GPUs, buggy integrated graphics drivers, virtual machines with incomplete WebGL2 support, or headless Chrome with an outdated SwiftShader build.

Related errors

• Program link failed
• Failed to create WebGL buffer
• Failed to create WebGL program
• Failed to create WebGL shader
• Failed to create WebGL texture

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

Appendix: source

Thrown at packages/effects/src/zoom-blur/zoom-blur-runtime.ts:36

	};
};

const compileShader = (
	gl: WebGL2RenderingContext,
	type: number,
	source: string,
): WebGLShader => {
	const shader = gl.createShader(type);
	if (!shader) {
		throw new Error('Failed to create WebGL shader');
	}

	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(`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);

View on GitHub (pinned to 78fe4bb3fd)