{"record":{"id":"f3c05a586665bb3e","repo":"mrdoob/three.js","slug":"three-renderer-clear-called-before-the-backend","errorCode":null,"errorMessage":"THREE.Renderer: .clear() called before the backend is initialized. Use \"await renderer.init();\" before using this method.","messagePattern":"THREE\\.Renderer: \\.clear\\(\\) called before the backend is initialized\\. Use \"await renderer\\.init\\(\\);\" before using this method\\.","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"src/renderers/common/Renderer.js","lineNumber":2467,"sourceCode":"\n\t\tconst renderContext = this._currentRenderContext;\n\n\t\treturn renderContext && this.backend.isOccluded( renderContext, object );\n\n\t}\n\n\t/**\n\t * Performs a manual clear operation. This method ignores `autoClear` properties.\n\t *\n\t * @param {boolean} [color=true] - Whether the color buffer should be cleared or not.\n\t * @param {boolean} [depth=true] - Whether the depth buffer should be cleared or not.\n\t * @param {boolean} [stencil=true] - Whether the stencil buffer should be cleared or not.\n\t */\n\tclear( color = true, depth = true, stencil = true ) {\n\n\t\tif ( this._initialized === false ) {\n\n\t\t\tthrow new Error( 'THREE.Renderer: .clear() called before the backend is initialized. Use \"await renderer.init();\" before using this method.' );\n\n\t\t}\n\n\t\tconst renderTarget = this._renderTarget || this._getFrameBufferTarget();\n\n\t\tlet renderContext = null;\n\n\t\tif ( renderTarget !== null ) {\n\n\t\t\tthis._textures.updateRenderTarget( renderTarget );\n\n\t\t\tconst renderTargetData = this._textures.get( renderTarget );\n\n\t\t\trenderContext = this._renderContexts.get( renderTarget, null, - 1 ); // using - 1 for the call depth to get a render context for the clear operation\n\t\t\trenderContext.textures = renderTargetData.textures;\n\t\t\trenderContext.depthTexture = renderTargetData.depthTexture;\n\t\t\trenderContext.width = renderTargetData.width;\n\t\t\trenderContext.height = renderTargetData.height;","sourceCodeStart":2449,"sourceCodeEnd":2485,"githubUrl":"https://github.com/mrdoob/three.js/blob/da05705fa31f02710c19772a2aa70c7454807f0c/src/renderers/common/Renderer.js#L2449-L2485","documentation":"Thrown by Renderer.clear() when the backend has not been initialized. clear() dispatches a manual clear to the backend, so it requires an initialized backend with a live context/device; calling it before init is rejected.","triggerScenarios":"Calling renderer.clear() right after constructing an async Renderer/WebGPURenderer without awaiting init; pre-render clears in a synchronous setup path.","commonSituations":"Manual clear logic in app initialization; porting from WebGLRenderer (synchronously ready) to the async Renderer; clearing in a resize handler that fires before init completes.","solutions":["await renderer.init() before the first clear() call.","Rely on renderer.autoClear for normal rendering and only call clear() after init in your render loop.","Start your render/clear logic only after the init promise resolves.","Guard manual clears with an initialized check."],"exampleFix":"// before\nconst renderer = new THREE.WebGPURenderer();\nrenderer.clear(); // throws\n\n// after\nconst renderer = new THREE.WebGPURenderer();\nawait renderer.init();\nrenderer.clear();","handlingStrategy":"validation","validationCode":"await renderer.init();\nrenderer.clear(); // safe now","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Await init before the first clear.","Rely on renderer.autoClear for normal frames.","Start render/clear logic only after init resolves.","Guard manual clears with an initialized check."],"tags":["renderer","initialization","async","clear","lifecycle"],"backgroundTag":null,"analyzedSha":"da05705fa31f02710c19772a2aa70c7454807f0c","analyzedAt":"2026-08-12T22:51:37.160Z","schemaVersion":2},"datasetVersion":"2026-08-12T23:17:12.415Z"}