remotion-dev/remotion · error · Error
Pattern shader compile failed: ${log ?? '(no log)'}
Error message
Pattern shader compile failed: ${log ?? '(no log)'} What it means
After pattern()'s GLSL shader source is submitted and compiled, the driver reports COMPILE_STATUS=false. Because the shader is authored in the library, a real compile failure points to a driver/GPU incompatibility (unsupported GLSL syntax/precision) or a context that is failing operations spuriously due to loss. The info log is interpolated so the driver's diagnostic is visible.
Source
Thrown at packages/effects/src/pattern.ts:410
}
`;
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(`Pattern 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
- Render on a GPU/browser combo with full WebGL2 + GLSL ES 3.00 support (modern Chromium).
- In CI/headless, use SwiftShader or a real GPU passthrough rather than a stub GL.
- Update GPU drivers.
- Report the interpolated info log to the Remotion team if it reproduces on a current Chromium build.
Defensive patterns
Strategy: try-catch
Validate before calling
// Probe shader compilation capability on this GPU once at startup.
function canCompilePatternShader(gl: WebGL2RenderingContext): boolean {
const s = gl.createShader(gl.FRAGMENT_SHADER);
if (!s) return false;
gl.shaderSource(s, PATTERN_FS);
gl.compileShader(s);
const ok = gl.getShaderParameter(s, gl.COMPILE_STATUS);
gl.deleteShader(s);
return Boolean(ok);
} Try / catch
try {
initPattern(canvas);
} catch (err) {
if (String(err.message).startsWith('Pattern shader compile failed')) {
logShaderIssue(err.message); // report driver incompatibility
useNonGpuFallback();
} else throw err;
} Prevention
- Render on current Chromium with full WebGL2/GLSL ES 3.00 support.
- Use SwiftShader or real GPU passthrough in CI rather than a stub GL.
- Update GPU drivers on render machines.
- Capture and report the driver info log when this reproduces on supposedly-supported hardware.
When it happens
Trigger: compileShader() calls gl.getShaderParameter(shader, COMPILE_STATUS) which returns false; gl.getShaderInfoLog yields the driver error. Occurs during pattern effect setup on every frame that instantiates it.
Common situations: GPU/driver that does not support the GLSL ES 3.00 features the shader uses; corrupted/lost context causing compile to fail; very old mobile GPU drivers; virtualized render environments without real GPU support.
Related errors
- Pixel Dissolve shader compile failed: ${log ?? '(no log)'}
- Contour lines shader compile failed: ${log ?? '(no log)'}
- Contour lines program link failed: ${log ?? '(no log)'}
- Shader compile failed: ${log ?? '(no log)'}
- Program link failed: ${log ?? '(no log)'}
AI-assisted analysis of remotion-dev/remotion@78fe4bb3fd (2026-08-12).
Data as JSON: /api/errors/aa41fb8ca96071c4.
Report an issue: GitHub.