{"record":{"id":"db0c9be432ba3c86","repo":"remotion-dev/remotion","slug":"failed-to-create-webgl-shader-db0c9b","errorCode":null,"errorMessage":"Failed to create WebGL shader","messagePattern":"Failed to create WebGL shader","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"critical","filePath":"packages/effects/src/zoom-blur/zoom-blur-runtime.ts","lineNumber":28,"sourceCode":"\treadonly vbo: WebGLBuffer;\n\treadonly textureSource: WebGLTexture;\n\treadonly uniforms: {\n\t\treadonly uSource: WebGLUniformLocation | null;\n\t\treadonly uResolution: WebGLUniformLocation | null;\n\t\treadonly uCenter: WebGLUniformLocation | null;\n\t\treadonly uAmount: WebGLUniformLocation | null;\n\t\treadonly uSamples: WebGLUniformLocation | null;\n\t};\n};\n\nconst compileShader = (\n\tgl: WebGL2RenderingContext,\n\ttype: number,\n\tsource: string,\n): WebGLShader => {\n\tconst shader = gl.createShader(type);\n\tif (!shader) {\n\t\tthrow new Error('Failed to create WebGL shader');\n\t}\n\n\tgl.shaderSource(shader, source);\n\tgl.compileShader(shader);\n\tif (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n\t\tconst log = gl.getShaderInfoLog(shader);\n\t\tgl.deleteShader(shader);\n\t\tthrow new Error(`Shader compile failed: ${log ?? '(no log)'}`);\n\t}\n\n\treturn shader;\n};\n\nconst linkProgram = (\n\tgl: WebGL2RenderingContext,\n\tvs: WebGLShader,\n\tfs: WebGLShader,\n): WebGLProgram => {","sourceCodeStart":10,"sourceCodeEnd":46,"githubUrl":"https://github.com/remotion-dev/remotion/blob/78fe4bb3fdb5a2cd68724393d63cb223db333fa7/packages/effects/src/zoom-blur/zoom-blur-runtime.ts#L10-L46","documentation":"During zoomBlur setup, the WebGL2 context's `gl.createShader()` returned `null`, meaning the GPU or driver refused to allocate a shader object. This is distinct from a compile error — the object itself could not be created. It typically signals WebGL context loss, GPU resource exhaustion, or a driver in an unrecoverable state.","triggerScenarios":"Calling `zoomBlur()` when the WebGL2 context has been lost (e.g., after a GPU crash or too many simultaneous contexts), on systems with outdated/broken GPU drivers, or after exhausting GPU memory with many concurrent effects.","commonSituations":"Rendering on headless CI without proper GPU support, running many effects concurrently on integrated graphics, driver crashes mid-render, or running in a browser tab after the OS suspended GPU acceleration.","solutions":["Reduce the number of simultaneous WebGL effects in the composition.","Ensure the rendering environment has a functional WebGL2 context (test with a simple WebGL demo).","Update GPU drivers or switch to a software-rendered WebGL implementation (SwiftShader).","Listen for `webglcontextlost` events on the canvas and handle context restoration."],"exampleFix":null,"handlingStrategy":"try-catch","validationCode":"// Check context health before applying the effect\ncanvas.addEventListener('webglcontextlost', (e) => {\n  e.preventDefault();\n  // mark effect as needing re-setup\n});","typeGuard":null,"tryCatchPattern":"try {\n  zoomBlur({ amount: 40 });\n} catch (err) {\n  if (err instanceof Error && err.message.includes('WebGL')) {\n    // fall back to no effect or a CSS-based blur\n    console.error('WebGL unavailable, skipping zoomBlur:', err.message);\n  } else {\n    throw err;\n  }\n}","preventionTips":["Monitor webglcontextlost events on the rendering canvas.","Limit the number of concurrent WebGL effects per composition.","Ensure the render environment has a working WebGL2 context."],"tags":["webgl","effects","zoom-blur","gpu","runtime"],"backgroundTag":null,"analyzedSha":"78fe4bb3fdb5a2cd68724393d63cb223db333fa7","analyzedAt":"2026-08-12T17:18:50.444Z","schemaVersion":2},"datasetVersion":"2026-08-12T23:17:12.415Z"}