{"record":{"id":"946628b9d20a6f93","repo":"remotion-dev/remotion","slug":"failed-to-create-webgl-shader-946628","errorCode":null,"errorMessage":"Failed to create WebGL shader","messagePattern":"Failed to create WebGL shader","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/effects/src/pattern.ts","lineNumber":402,"sourceCode":"\t\t\tif (sampleCell(cell + vec2(float(x), float(y)), fragPx, cropStart, tileSize, pitch, originPx, color)) {\n\t\t\t\tfragColor = color;\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\t}\n\n\tfragColor = vec4(0.0);\n}\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(`Pattern 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":384,"sourceCodeEnd":420,"githubUrl":"https://github.com/remotion-dev/remotion/blob/78fe4bb3fdb5a2cd68724393d63cb223db333fa7/packages/effects/src/pattern.ts#L384-L420","documentation":"pattern() compiles fixed GLSL shaders during WebGL2 setup. gl.createShader() returns null only when the context is lost or the driver refuses allocation. Because the shader source is fixed in the library, this null almost always indicates a dead/lost context rather than a code defect.","triggerScenarios":"Reached in compileShader() during pattern effect setup, before any user-visible frame. The context returned a valid WebGL2 object from getContext but createShader now returns null (context lost between acquisition and compile).","commonSituations":"GPU reset mid-setup; context eviction in a long render; headless rendering with an unstable GPU; concurrent renders saturating driver resources.","solutions":["Ensure a stable WebGL2 context before rendering (GPU available / SwiftShader in CI).","Handle 'webglcontextlost' and re-initialize the effect on 'webglcontextrestored'.","Avoid stacking many GPU effects in one composition during heavy renders.","Update GPU drivers or switch to a software WebGL backend."],"exampleFix":null,"handlingStrategy":"try-catch","validationCode":null,"typeGuard":null,"tryCatchPattern":"try {\n  initPattern(canvas); // compiles pattern shaders\n} catch (err) {\n  if (isContextLost(canvas)) {\n    waitForRestore(canvas).then(initPattern); // retry on restore\n  } else {\n    throw err;\n  }\n}","preventionTips":["Render on a verified WebGL2-capable environment (real GPU or SwiftShader).","Register webglcontextlost/restored handlers and re-run shader setup on restore.","Avoid stacking many GPU effects so the driver does not refuse allocations.","Keep GPU drivers current."],"tags":["webgl","gpu","shader","pattern-effect","context-loss","rendering"],"backgroundTag":null,"analyzedSha":"78fe4bb3fdb5a2cd68724393d63cb223db333fa7","analyzedAt":"2026-08-12T17:18:50.444Z","schemaVersion":2},"datasetVersion":"2026-08-12T23:17:12.415Z"}