remotion-dev/remotion · error · Error

Failed to create vibrance vertex array

Error message

Failed to create vibrance vertex array

What it means

Thrown during vibrance setup when gl.createVertexArray() returns null. The VAO object cannot be allocated, indicating WebGL context loss or the GL implementation refusing another object. The vibrance pipeline needs a VAO to bind the fullscreen-quad attributes, so it cannot proceed without one.

Source

Thrown at packages/effects/src/vibrance.ts:171

	return texture;
};

const setupVibrance = (target: HTMLCanvasElement): VibranceState => {
	const gl = target.getContext('webgl2', {
		premultipliedAlpha: true,
		alpha: true,
		preserveDrawingBuffer: true,
	});
	if (!gl) {
		throw createWebGL2ContextError('vibrance effect');
	}

	gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);

	const program = createProgram(gl);
	const vao = gl.createVertexArray();
	if (!vao) {
		throw new Error('Failed to create vibrance vertex array');
	}

	const vbo = gl.createBuffer();
	if (!vbo) {
		throw new Error('Failed to create vibrance vertex buffer');
	}

	gl.bindVertexArray(vao);
	gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
	gl.bufferData(
		gl.ARRAY_BUFFER,
		new Float32Array([-1, -1, 0, 0, 1, -1, 1, 0, -1, 1, 0, 1, 1, 1, 1, 1]),
		gl.STATIC_DRAW,
	);

	const aPos = gl.getAttribLocation(program, 'aPos');
	const aUv = gl.getAttribLocation(program, 'aUv');
	gl.enableVertexAttribArray(aPos);

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Reload the page/Studio to re-establish a fresh WebGL2 context.
2. Reduce concurrent WebGL effect instances so fewer VAOs are live at once.
3. Confirm WebGL2 is hardware accelerated (chrome://gpu) and update drivers if context loss recurs.
4. For headless rendering, use a Chrome build with working VAO support and adequate resources.

Example fix

// before
const effect = vibrance({amount: 1});

// after
const effect = (() => {
  try { return vibrance({amount: 1}); } catch { return null; }
})();

let effect = null;
try {
  effect = vibrance({amount: 1});
} catch (err) {
  console.warn('vibrance VAO alloc failed, skipping effect', err);
}

When it happens

Trigger: setupVibrance() calls gl.createVertexArray() after creating the program; it returns null on a lost context or when the driver's VAO budget is exhausted.

Common situations: Lost WebGL2 context in Studio with many effects; a driver/GPU that caps VAO count; context loss between getContext('webgl2') succeeding and the createVertexArray call.

Related errors

• Failed to create vibrance texture
• Failed to create vibrance vertex buffer
• Failed to create WebGL vertex array
• Failed to create WebGL buffer
• Failed to create WebGL shader

AI-assisted analysis of remotion-dev/remotion@78fe4bb3fd (2026-08-12). Data as JSON: /api/errors/b93d7cb68f21652f. Report an issue: GitHub.