remotion-dev/remotion · error · Error

Vibrance shader link failed: ${log ?? '(no log)'}

Error message

Vibrance shader link failed: ${log ?? '(no log)'}

What it means

Thrown by the vibrance effect's internal createProgram during setup when gl.linkProgram reports LINK_STATUS === false. The program info log is appended (or '(no log)' if absent). Vibrance compiles and links its own hardcoded GLSL ES 3.00 vertex+fragment shaders, so a link failure means the GPU driver rejected the linked program rather than user-supplied GLSL.

Source

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

const createProgram = (gl: WebGL2RenderingContext): WebGLProgram => {
	const vertexShader = compileShader(gl, gl.VERTEX_SHADER, VERTEX_SHADER);
	const fragmentShader = compileShader(gl, gl.FRAGMENT_SHADER, FRAGMENT_SHADER);
	const program = gl.createProgram();
	if (!program) {
		throw new Error('Failed to create vibrance shader program');
	}

	gl.attachShader(program, vertexShader);
	gl.attachShader(program, fragmentShader);
	gl.linkProgram(program);
	gl.deleteShader(vertexShader);
	gl.deleteShader(fragmentShader);

	if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
		const log = gl.getProgramInfoLog(program);
		gl.deleteProgram(program);
		throw new Error(`Vibrance shader link failed: ${log ?? '(no log)'}`);
	}

	return program;
};

const createTexture = (gl: WebGL2RenderingContext): WebGLTexture => {
	const texture = gl.createTexture();
	if (!texture) {
		throw new Error('Failed to create vibrance texture');
	}

	gl.bindTexture(gl.TEXTURE_2D, texture);
	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
	gl.bindTexture(gl.TEXTURE_2D, null);
	return texture;

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Reload the page/Studio to reset the WebGL2 context and re-run setup.
  2. Reduce the number of WebGL-backed effects applied concurrently on screen.
  3. Update GPU drivers / enable hardware-accelerated WebGL2 in the browser or headless Chrome flags.
  4. For server rendering, confirm the Chrome build advertises WebGL2 (chrome://gpu) and that software rendering (SwiftShader) is not rejecting the program.
  5. If reproducible, capture the appended info log and report it against @remotion/effects with the GPU/driver details.

Example fix

// before - effect setup throws on context loss, breaking the composition
import {vibrance} from '@remotion/effects';

export const Comp = () => (
  <VideoEffects effects={[vibrance({amount: 1})]} src={src} />
);

// after - tolerate setup failure and fall back to the plain source
import {vibrance} from '@remotion/effects';

const tryEffect = (factory) => {
  try {
    return factory();
  } catch (err) {
    console.warn('effect unavailable, falling back', err);
    return null;
  }
};

export const Comp = () => {
  const effect = tryEffect(() => vibrance({amount: 1}));
  return (
    <VideoEffects effects={effect ? [effect] : []} src={src} />
  );
};
Defensive patterns

Strategy: try-catch

Validate before calling

// Vibrance shaders are internal library GLSL; no caller validation can prevent a driver link failure.
// Best pre-check is the host's WebGL2 capability (context loss can still strike later):
const supportsWebGL2 = () => {
  try {
    const c = document.createElement('canvas');
    return !!c.getContext('webgl2');
  } catch {
    return false;
  }
};

Try / catch

let effect = null;
try {
  effect = vibrance({amount: 1});
} catch (err) {
  console.warn('vibrance unavailable on this GPU/context, skipping', err);
  effect = null; // render the plain source instead
}

Prevention

When it happens

Trigger: vibrance() effect setup() runs createProgram, which attaches the compiled internal vertex/fragment shaders and calls gl.linkProgram; the driver returns LINK_STATUS false. This occurs on WebGL context loss mid-setup, a driver that rejects the internal GLSL, or a GPU pushed into a degraded state.

Common situations: Too many simultaneous WebGL2 contexts in Remotion Studio forcing context loss; headless Chrome (e.g. Remotion Lambda) whose SwiftShader/software GL rejects the program; outdated or buggy GPU drivers; virtual machines without hardware GL acceleration.

Related errors


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