remotion-dev/remotion · error · Error
Failed to create WebGL noise texture
Error message
Failed to create WebGL noise texture
What it means
Internal error from the `roughenEdges()` effect setup: `gl.createTexture()` returned `null` while allocating the dedicated noise texture (a 256×256 RGBA byte texture seeded by an xorshift PRNG). Environment-level allocation failure, not a param error. Distinct from the source-texture error so the failure point is unambiguous in stack traces.
Source
Thrown at packages/effects/src/roughen-edges.ts:409
gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false);
gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, false);
gl.texImage2D(
gl.TEXTURE_2D,
0,
gl.RGBA,
NOISE_TEXTURE_SIZE,
NOISE_TEXTURE_SIZE,
0,
gl.RGBA,
gl.UNSIGNED_BYTE,
data,
);
};
const createNoiseTexture = (gl: WebGL2RenderingContext): WebGLTexture => {
const texture = gl.createTexture();
if (!texture) {
throw new Error('Failed to create WebGL noise texture');
}
uploadNoiseTexture(gl, texture, DEFAULT_SEED);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.REPEAT);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.REPEAT);
gl.bindTexture(gl.TEXTURE_2D, null);
return texture;
};
const setupRoughenEdges = (target: HTMLCanvasElement): RoughenEdgesState => {
const gl = target.getContext('webgl2', {
premultipliedAlpha: true,
alpha: true,
preserveDrawingBuffer: true,
});
if (!gl) {View on GitHub (pinned to 78fe4bb3fd)
Solutions
- Reload the page or restart the render.
- Lower the count of concurrently mounted effects.
- Update GPU drivers / use hardware acceleration.
- Handle `webglcontextlost` to tear down and re-create textures.
Defensive patterns
Strategy: try-catch
Validate before calling
const canAllocateTexture = (): boolean => {
try {
const c = document.createElement('canvas');
const gl = c.getContext('webgl2');
if (!gl) return false;
const t = gl.createTexture();
if (t) gl.deleteTexture(t);
return !!t;
} catch {
return false;
}
}; Try / catch
try {
roughenEdges()({...});
} catch (err) {
if (err instanceof Error && /Failed to create WebGL noise texture/.test(err.message)) {
// reduce active effects and retry
} else {
throw err;
}
} Prevention
- Feature-detect texture allocation before mounting effects.
- Reduce concurrent effect count to free texture objects.
- Call the effect `cleanup` on unmount to release the noise texture.
- Handle context loss/restore to rebuild textures.
When it happens
Trigger: Context loss between source-texture and noise-texture creation; GPU texture-memory exhaustion; software GL backend with low texture limits.
Common situations: Many effects mounted at once; constrained CI GPU; systems resuming from sleep with a stale context.
Related errors
- Failed to create WebGL texture
- Failed to create WebGL texture
- Failed to create WebGL shader
- Failed to create WebGL program
- Failed to create WebGL vertex array
AI-assisted analysis of remotion-dev/remotion@78fe4bb3fd (2026-08-12).
Data as JSON: /api/errors/e6ca948fbc3e9e86.
Report an issue: GitHub.