remotion-dev/remotion · error · Error

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

Error message

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

What it means

The shine() effect compiles its vertex and fragment shaders via gl.compileShader(). If the GLSL compiler rejects the source (COMPILE_STATUS is false), the effect reads the info log, deletes the shader, and throws this Error with the driver's diagnostic message. Since the shader source is a library constant, a compile failure almost always indicates a driver bug or an unsupported GPU feature rather than a user error.

Source

Thrown at packages/effects/src/shine.ts:202

}
`;

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(`Shine 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

1. Read the info log in the error message to identify the specific GLSL issue.
2. Update GPU drivers and the browser/Chromium version to the latest stable release.
3. Switch to a render environment (runner or Lambda layer) with a known-good WebGL2 stack.
4. Report the issue to Remotion if the shader source itself has a portability bug — include the full info log.

Example fix

null

null

null

try {
  shine({ progress: 0.5 });
} catch (e) {
  if (e instanceof Error && e.message.startsWith('Shine shader compile failed')) {
    // Driver cannot compile the GLSL — report and fall back
    console.error('Shader compile error:', e.message);
    // Use a non-WebGL alternative or update the GPU stack
  } else {
    throw e;
  }
}

When it happens

Trigger: Calling shine() on a GPU/driver combination that cannot compile the #version 300 es GLSL ES shaders — typically very old drivers, buggy mobile GPUs, or software rasterizers with incomplete GLSL ES 3.00 support. The error message will contain the specific compiler diagnostic (e.g., unsupported precision qualifier, unknown builtin).

Common situations: Rendering on legacy integrated GPUs with outdated drivers; SwiftShader versions with partial GLSL ES 3.00 support; a regression in a browser's ANGLE translation layer; running in a remote desktop or VM with a virtual GPU.

Related errors

• Shrinkwrap shader compile failed: ${log ?? '(no log)'}
• Shader compile failed: ${log ?? '(no log)'}
• Program link failed: ${log ?? '(no log)'}
• Noise displacement shader compile failed: ${log ?? '(no log)
• Noise displacement program link failed: ${log ?? '(no log)'}

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