{"record":{"id":"1ddade2330146135","repo":"remotion-dev/remotion","slug":"failed-to-create-webgl-vertex-array-1ddade","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/wave/wave-runtime.ts","lineNumber":122,"sourceCode":"\nexport const setupWave = (target: HTMLCanvasElement): WaveState => {\n\tconst gl = target.getContext('webgl2', {\n\t\tpremultipliedAlpha: true,\n\t\talpha: true,\n\t\tpreserveDrawingBuffer: true,\n\t});\n\tif (!gl) {\n\t\tthrow createWebGL2ContextError('wave effect');\n\t}\n\n\tgl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);\n\tgl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);\n\n\tconst program = createProgram(gl, WAVE_VS, WAVE_FS);\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":104,"sourceCodeEnd":140,"githubUrl":"https://github.com/remotion-dev/remotion/blob/78fe4bb3fdb5a2cd68724393d63cb223db333fa7/packages/effects/src/wave/wave-runtime.ts#L104-L140","documentation":"Thrown by setupWave() when gl.createVertexArray() returns null. A vertex array object (VAO) creation returns null only on context loss, context destruction, or GPU resource exhaustion. This is a low-level WebGL allocation failure that prevents the wave effect from setting up its geometry bindings.","triggerScenarios":"Called from setupWave() at packages/effects/src/wave/wave-runtime.ts:120 after the program is created. Fires when the GL context is lost or the GPU cannot allocate another VAO. Since the program was already created successfully, this is a progressive resource exhaustion or a context-loss event that occurred between program creation and VAO creation.","commonSituations":"WebGL context lost event fired mid-setup; GPU memory exhausted from many concurrent effect canvases; running in a constrained environment (mobile GPU, older integrated graphics, virtual machine); browser tab GPU process instability.","solutions":["Listen for the 'webglcontextlost' event on the canvas and recreate the context (and re-run setupWave) on 'webglcontextrestored'.","Reduce the number of concurrent effect instances to free VAO slots.","Ensure prior effect states are cleaned up (cleanupWave) before creating new canvases.","Update GPU drivers or switch render environments (e.g., use a different Chrome/Chromium build for headless rendering)."],"exampleFix":"// before\ncanvas.addEventListener('webglcontextlost', (e) => {\n  // no handler — context lost silently, subsequent setup throws\n});\nconst state = setupWave(canvas);\n\n// after\ncanvas.addEventListener('webglcontextlost', (e) => {\n  e.preventDefault(); // allow restoration\n});\ncanvas.addEventListener('webglcontextrestored', () => {\n  state = setupWave(canvas); // re-initialize on restore\n});","handlingStrategy":"try-catch","validationCode":null,"typeGuard":null,"tryCatchPattern":"const gl = canvas.getContext('webgl2');\nif (!gl || gl.isContextLost()) {\n  return; // skip setup on lost context\n}\ntry {\n  const state = setupWave(canvas);\n} catch (e) {\n  if ((e as Error).message === 'Failed to create WebGL vertex array') {\n    console.warn('VAO allocation failed — possible context loss:', (e as Error).message);\n  }\n}","preventionTips":["Handle 'webglcontextlost'/'webglcontextrestored' events on effect canvases.","Clean up old effect states before creating new ones.","Limit the number of concurrent WebGL effects per frame."],"tags":["webgl","gpu","vao","resource-exhaustion","wave-effect"],"backgroundTag":null,"analyzedSha":"78fe4bb3fdb5a2cd68724393d63cb223db333fa7","analyzedAt":"2026-08-12T17:18:50.444Z","schemaVersion":2},"datasetVersion":"2026-08-12T23:17:12.415Z"}