What causes "Shader compile failed: ${log ?? '(no log)'}" in remotion-dev/remotion?

Report the issue to the Remotion team with the full shader compile log and your GPU/driver details — the shader source is library-controlled.

remotion-dev/remotion · critical · Error

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

Error message

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

What it means

The mirror effect's GLSL shader source (MIRROR_VS or MIRROR_FS) failed to compile on the target GPU. The error message includes the GLSL compiler log from gl.getShaderInfoLog(). This almost always indicates a GPU driver incompatibility or a bug in the shader source shipped with @remotion/effects — not a user parameter error, since the shader source is static within the library.

Source

Thrown at packages/effects/src/mirror/mirror-runtime.ts:37

	};
};

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)

Solutions

Report the issue to the Remotion team with the full shader compile log and your GPU/driver details — the shader source is library-controlled.
Update your GPU drivers to the latest version.
Switch to a software renderer (SwiftShader) or a different GPU to work around driver bugs.
On CI, ensure the headless Chrome build includes WebGL2 shader support.

Defensive patterns

Strategy: try-catch

Try / catch

// Shader compile failures are library/driver bugs — catch and report
try {
  // render with mirror effect
} catch (e) {
  if (e instanceof Error && e.message.startsWith('Shader compile failed')) {
    // Report the GLSL log to your monitoring/Remotion team
    console.error('Mirror shader compile failed:', e.message);
    // Fallback: render without the effect
  } else {
    throw e;
  }
}

Prevention

Keep GPU drivers updated in render environments.
Test effects on the target GPU before deploying to production rendering pipelines.
Report shader compile logs to the Remotion team so library-level shader bugs can be fixed.

When it happens

Trigger: During setupMirror, gl.compileShader runs on MIRROR_VS or MIRROR_FS and gl.getShaderParameter(shader, gl.COMPILE_STATUS) returns false. The GLSL compiler rejected the shader, and the info log is included in the message.

Common situations: GPU drivers that don't fully support WebGL2 GLSL ES 3.00 (#version 300 es); outdated or buggy GPU drivers; software rasterizers with incomplete shader compilers; running on very old GPU hardware. This is rarely caused by user input.

Related errors

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