remotion-dev/remotion · critical · Error
Failed to create WebGL vertex array
Error message
Failed to create WebGL vertex array
What it means
While setting up the noiseDisplacement effect's geometry, gl.createVertexArray() returned null. The WebGL2 context created shaders, program, and linked successfully, but cannot allocate a VAO — indicating context degradation, resource limits, or driver issues late in the setup sequence.
Source
Thrown at packages/effects/src/noise-displacement.ts:467
premultipliedAlpha: true,
alpha: true,
preserveDrawingBuffer: true,
});
if (!gl) {
throw createWebGL2ContextError('noise displacement effect');
}
gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
const vs = compileShader(gl, gl.VERTEX_SHADER, NOISE_DISPLACEMENT_VS);
const fs = compileShader(gl, gl.FRAGMENT_SHADER, NOISE_DISPLACEMENT_FS);
const program = linkProgram(gl, vs, fs);
gl.deleteShader(vs);
gl.deleteShader(fs);
const vao = gl.createVertexArray();
if (!vao) {
throw new Error('Failed to create WebGL vertex array');
}
gl.bindVertexArray(vao);
const data = new Float32Array([
-1, -1, 0, 0, 1, -1, 1, 0, -1, 1, 0, 1, 1, 1, 1, 1,
]);
const vbo = gl.createBuffer();
if (!vbo) {
throw new Error('Failed to create WebGL buffer');
}
gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
gl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);
const aPos = gl.getAttribLocation(program, 'aPos');
const aUv = gl.getAttribLocation(program, 'aUv');View on GitHub (pinned to 78fe4bb3fd)
Solutions
- Ensure the environment fully supports WebGL2 VAOs — update GPU drivers.
- Handle WebGL context loss and retry rendering.
- Reduce concurrent WebGL effects.
- For headless/CI rendering, verify Chrome GPU flags enable WebGL2 VAO operations.
Defensive patterns
Strategy: try-catch
Try / catch
try {
// apply noiseDisplacement effect
} catch (e) {
if (e instanceof Error && e.message.includes('WebGL vertex array')) {
console.warn('WebGL VAO creation failed, skipping noiseDisplacement effect');
// fallback path
} else {
throw e;
}
} Prevention
- Ensure WebGL2 VAO support in the render environment — update GPU drivers.
- Handle context loss and retry rendering.
- Limit concurrent WebGL effects to avoid VAO allocation limits.
When it happens
Trigger: During setupNoiseDisplacement, after the program is linked and shaders deleted, gl.createVertexArray() returns null. The VAO is needed to encapsulate the aPos and aUv attribute bindings.
Common situations: Context loss during setup; GPU driver hitting VAO allocation limits; headless environments with incomplete WebGL2 VAO support; resource exhaustion from many concurrent effects.
Related errors
- Failed to create WebGL program
- Failed to create WebGL program
- Failed to create WebGL texture
- Failed to create WebGL vertex array
- Failed to create WebGL buffer
AI-assisted analysis of remotion-dev/remotion@78fe4bb3fd (2026-08-12).
Data as JSON: /api/errors/f4ee9b35f69879b5.
Report an issue: GitHub.