{"record":{"id":"7947e342441f08d8","repo":"remotion-dev/remotion","slug":"failed-to-create-webgl-vertex-array-7947e3","errorCode":null,"errorMessage":"Failed to create WebGL vertex array","messagePattern":"Failed to create WebGL vertex array","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"critical","filePath":"packages/effects/src/radial-progressive-blur/radial-progressive-blur-runtime.ts","lineNumber":152,"sourceCode":"\t\tthrow createWebGL2ContextError('radial progressive blur effect');\n\t}\n\n\tgl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);\n\n\tconst programHorizontal = createProgram(\n\t\tgl,\n\t\tRADIAL_PROGRESSIVE_BLUR_VS,\n\t\tbuildRadialProgressiveBlurFs('horizontal'),\n\t);\n\tconst programVertical = createProgram(\n\t\tgl,\n\t\tRADIAL_PROGRESSIVE_BLUR_VS,\n\t\tbuildRadialProgressiveBlurFs('vertical'),\n\t);\n\n\tconst vao = gl.createVertexArray();\n\tif (!vao) {\n\t\tthrow new Error('Failed to create WebGL vertex array');\n\t}\n\n\tgl.bindVertexArray(vao);\n\n\tconst data = new Float32Array([\n\t\t-1, -1, 0, 0, 1, -1, 1, 0, -1, 1, 0, 1, 1, 1, 1, 1,\n\t]);\n\n\tconst vbo = gl.createBuffer();\n\tif (!vbo) {\n\t\tthrow new Error('Failed to create WebGL buffer');\n\t}\n\n\tgl.bindBuffer(gl.ARRAY_BUFFER, vbo);\n\tgl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);\n\n\tgl.enableVertexAttribArray(0);\n\tgl.vertexAttribPointer(0, 2, gl.FLOAT, false, 16, 0);","sourceCodeStart":134,"sourceCodeEnd":170,"githubUrl":"https://github.com/remotion-dev/remotion/blob/78fe4bb3fdb5a2cd68724393d63cb223db333fa7/packages/effects/src/radial-progressive-blur/radial-progressive-blur-runtime.ts#L134-L170","documentation":"The radial-progressive-blur runtime creates a Vertex Array Object (VAO) to encapsulate vertex attribute bindings. If gl.createVertexArray() returns null, the GL context cannot allocate the object, typically because the context is lost or resource limits are exceeded.","triggerScenarios":"Calling setupRadialProgressiveBlur() after context loss, under severe GPU resource pressure, or on a context where too many VAOs are already outstanding.","commonSituations":"Mobile GPU drivers with low VAO limits; long-running sessions with leaks of GL objects; contexts in a lost state after a GPU crash.","solutions":["Register a 'webglcontextlost' handler and reinitialize after 'webglcontextrestored'","Audit the composition for unreleased WebGL effects that leak VAOs","Reduce the number of simultaneous WebGL2 effects","Restart the render in a fresh browser/Headless Chrome process"],"exampleFix":null,"handlingStrategy":"retry","validationCode":null,"typeGuard":null,"tryCatchPattern":"canvas.addEventListener('webglcontextlost', (e) => { e.preventDefault(); }, false);\ncanvas.addEventListener('webglcontextrestored', () => {\n  // re-initialize effects, re-creating VAOs\n}, false);","preventionTips":["Handle context loss/restoration on every canvas that uses WebGL effects","Dispose of effects properly to avoid leaking VAOs","Limit concurrent GPU effects"],"tags":["webgl","gpu","vao","resource-exhaustion","context-lost","radial-progressive-blur"],"backgroundTag":null,"analyzedSha":"78fe4bb3fdb5a2cd68724393d63cb223db333fa7","analyzedAt":"2026-08-12T17:18:50.444Z","schemaVersion":2},"datasetVersion":"2026-08-12T18:17:37.767Z"}