Examples: Fix WebGPU logarithmic detph buffer demo. (#28249)

examples/webgpu_camera_logarithmicdepthbuffer.html

@@ -118,9 +118,9 @@
 				{ size: 1e19, scale: 1.0, label: 'mind boggling (1000 light years)' }
 			];
 
-			init();
+			init().then( animate );
 
-			function init() {
+			async function init() {
 
 				if ( WebGPU.isAvailable() === false && WebGL.isWebGL2Available() === false ) {
 
@@ -133,15 +133,13 @@
 				container = document.getElementById( 'container' );
 
 				const loader = new FontLoader();
-				loader.load( 'fonts/helvetiker_regular.typeface.json', function ( font ) {
+				const font = await loader.loadAsync( 'fonts/helvetiker_regular.typeface.json' );
 
-					const scene = initScene( font );
+				const scene = initScene( font );
 
-					// Initialize two copies of the same scene, one with normal z-buffer and one with logarithmic z-buffer
-					objects.normal = initView( scene, 'normal', false );
-					objects.logzbuf = initView( scene, 'logzbuf', true );
-
-				} );
+				// Initialize two copies of the same scene, one with normal z-buffer and one with logarithmic z-buffer
+				objects.normal = await initView( scene, 'normal', false );
+				objects.logzbuf = await initView( scene, 'logzbuf', true );
 
 				stats = new Stats();
 				container.appendChild( stats.dom );
@@ -156,7 +154,7 @@
 
 			}
 
-			function initView( scene, name, logDepthBuf ) {
+			async function initView( scene, name, logDepthBuf ) {
 
 				const framecontainer = document.getElementById( 'container_' + name );
 
@@ -166,11 +164,12 @@
 				const renderer = new WebGPURenderer( { antialias: true, logarithmicDepthBuffer: logDepthBuf } );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( SCREEN_WIDTH / 2, SCREEN_HEIGHT );
-				renderer.setAnimationLoop( render );
 				renderer.domElement.style.position = 'relative';
 				renderer.domElement.id = 'renderer_' + name;
 				framecontainer.appendChild( renderer.domElement );
 
+				await renderer.init();
+
 				return { container: framecontainer, renderer: renderer, scene: scene, camera: camera };
 
 			}
@@ -259,7 +258,9 @@
 
 			}
 
-			function render() {
+			function animate() {
+
+				requestAnimationFrame( animate );
 
 				// Put some limits on zooming
 				const minzoom = labeldata[ 0 ].size * labeldata[ 0 ].scale * 1;