remotion-dev/remotion · error · Error

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

Error message

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

What it means

The `roughenEdges()` effect's GLSL shader failed to compile. The vertex and fragment shaders are static string constants bundled with the effect, so under normal conditions this never fires. A compile failure means the running WebGL2 driver rejected the GLSL ES 3.00 source — typically a non-conformant driver, a corrupted/patched effects build, or a context that lost its compiler after a GPU reset.

Source

Thrown at packages/effects/src/roughen-edges.ts:309

}
`;

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

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Run on a WebGL2-conformant browser/GPU with hardware acceleration.
2. Reinstall `@remotion/effects` to rule out a patched shader source.
3. Handle context loss/restore so the shader is recompiled cleanly.
4. Capture `gl.getShaderInfoLog()` (included in the message) and the renderer string, then file a Remotion issue.

try {
  roughenEdges()({...});
} catch (err) {
  if (err instanceof Error && /Roughen edges shader compile failed/.test(err.message)) {
    // capture err.message (the GLSL info log) for a bug report and fall back
  } else {
    throw err;
  }
}

When it happens

Trigger: Non-conformant GLSL ES 3.00 driver (older mobile, virtual, or software GPU); a fork of `@remotion/effects` where the `ROUGHEN_EDGES_FS` template literal was hand-edited; compiling after an unhandled `webglcontextlost`.

Common situations: Headless rendering via Xvfb; mobile WebView; remote-desktop virtual GPU; locally patched effects package.

Related errors

• Roughen edges program link failed: ${log ?? '(no log)'}
• Rings shader compile failed: ${log ?? '(no log)'}
• Rings program link failed: ${log ?? '(no log)'}
• Failed to create WebGL shader
• Checkerboard shader compile failed: ${log ?? '(no log)'}

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