diff --git a/packages/viewer/src/components/viewer/index.tsx b/packages/viewer/src/components/viewer/index.tsx
index a59fd45e..7f23decc 100644
--- a/packages/viewer/src/components/viewer/index.tsx
+++ b/packages/viewer/src/components/viewer/index.tsx
@@ -41,9 +41,8 @@ const Viewer: React.FC<ViewerProps> = ({ children, selectionManager = 'default',
     <Canvas
       dpr={[1, 1.5]}
       className={'bg-[#fafafa]'}
-      gl={async (props) => {
+      gl={(props) => {
         const renderer = new THREE.WebGPURenderer(props as any)
-        await renderer.init()
         renderer.toneMapping = THREE.ACESFilmicToneMapping
         renderer.toneMappingExposure = 0.9
         return renderer
diff --git a/packages/viewer/src/components/viewer/post-processing.tsx b/packages/viewer/src/components/viewer/post-processing.tsx
index 3577187e..a8a2cde1 100644
--- a/packages/viewer/src/components/viewer/post-processing.tsx
+++ b/packages/viewer/src/components/viewer/post-processing.tsx
@@ -1,5 +1,5 @@
 import { useFrame, useThree } from '@react-three/fiber'
-import { useEffect, useRef } from 'react'
+import { useEffect, useRef, useState } from 'react'
 import { Color, UnsignedByteType } from 'three'
 import { outline } from 'three/addons/tsl/display/OutlineNode.js'
 import { ssgi } from 'three/addons/tsl/display/SSGINode.js'
@@ -43,9 +43,26 @@ export const SSGI_PARAMS = {
 const PostProcessingPasses = () => {
   const { gl: renderer, scene, camera } = useThree()
   const renderPipelineRef = useRef<RenderPipeline | null>(null)
+  const [isInitialized, setIsInitialized] = useState(false)
 
   useEffect(() => {
-    if (!renderer || !scene || !camera) {
+    let mounted = true
+    const initRenderer = async () => {
+      if (renderer && (renderer as any).init) {
+        await (renderer as any).init()
+      }
+      if (mounted) {
+        setIsInitialized(true)
+      }
+    }
+    initRenderer()
+    return () => {
+      mounted = false
+    }
+  }, [renderer])
+
+  useEffect(() => {
+    if (!renderer || !scene || !camera || !isInitialized) {
       return
     }
 
@@ -173,7 +190,7 @@ const PostProcessingPasses = () => {
       }
       renderPipelineRef.current = null
     }
-  }, [renderer, scene, camera])
+  }, [renderer, scene, camera, isInitialized])
 
   useFrame(() => {
     if (renderPipelineRef.current) {