BabylonJS/Babylon.js · critical · Error

Something went wrong while creating a gl ${type} shader obje

Error message

Something went wrong while creating a gl ${type} shader object. gl error=${error}, gl isContextLost=${gl.isContextLost()}, _contextWasLost=${_contextWasLost}

What it means

Thrown by CompileRawShader when gl.createShader(type) returned null/failed — the engine drains gl.getError() and reports the last GL error code, whether the context is lost, and the engine's internal _contextWasLost flag. This means the GL driver refused to create the shader object itself (not a GLSL compile failure).

Source

Thrown at packages/dev/core/src/Engines/thinEngine.functions.ts:338

    onReady();
}

function CompileShader(source: string, type: string, defines: Nullable<string>, shaderVersion: string, gl: WebGLContext, _contextWasLost?: boolean): WebGLShader {
    return CompileRawShader(_ConcatenateShader(source, defines, shaderVersion), type, gl, _contextWasLost);
}

function CompileRawShader(source: string, type: string, gl: WebGLContext, _contextWasLost?: boolean): WebGLShader {
    const shader = gl.createShader(type === "vertex" ? gl.VERTEX_SHADER : gl.FRAGMENT_SHADER);

    if (!shader) {
        let error: GLenum = gl.NO_ERROR;
        let tempError: GLenum;
        while ((tempError = gl.getError()) !== gl.NO_ERROR) {
            error = tempError;
        }

        throw new Error(
            `Something went wrong while creating a gl ${type} shader object. gl error=${error}, gl isContextLost=${gl.isContextLost()}, _contextWasLost=${_contextWasLost}`
        );
    }

    gl.shaderSource(shader, source);
    gl.compileShader(shader);

    return shader;
}

/**
 * @internal
 */
export function _setProgram(program: Nullable<WebGLProgram>, gl: WebGLContext): void {
    gl.useProgram(program);
}

/**

View on GitHub (pinned to 0592b347b8)

Solutions

  1. Check the reported isContextLost value; if true, listen for the engine's onContextLost/ContextLostObservable and re-create the engine
  2. Free GPU resources (dispose unused materials/textures) and retry when the error is OUT_OF_MEMORY
  3. Reload the scene/engine after handling onContextLost — a lost WebGL context is usually unrecoverable in-place
  4. Verify the engine was not disposed before shader compilation

Example fix

// before
engine.createEffect(...); // throws if context was lost
// after
engine.onContextLostObservable.add(() => recreateEngine());
if (!engine._gl.isContextLost()) { engine.createEffect(...); }
Defensive patterns

Strategy: retry

Validate before calling

function canCompile(engine: { _gl: WebGLRenderingContext }): boolean {
  return !!engine._gl && !engine._gl.isContextLost() && engine._gl.getError() === engine._gl.NO_ERROR;
}

Type guard

function isContextLostError(e: unknown): boolean {
  return e instanceof Error && e.message.includes('isContextLost=true');
}

Try / catch

try {
  engine.createEffect(...);
} catch (e) {
  if (isContextLostError(e)) {
    engine.onContextLostObservable.addOnce(() => setTimeout(rebuildScene, 100));
  } else throw e;
}

Prevention

When it happens

Trigger: gl.createShader returns null: WebGL context lost (GPU reset, driver crash), GL error state like OUT_OF_MEMORY, or calling shader compilation after the context was disposed.

Common situations: Laptop GPUs resetting on driver crash or overheat; mobile browsers losing context on backgrounding; too many shaders/buffers exhausting GPU memory; creating an engine during page teardown.

Related errors


AI-assisted analysis of BabylonJS/Babylon.js@0592b347b8 (2026-08-30). Data as JSON: /api/errors/3dcfc7804f76ded9. Report an issue: GitHub.