diff --git a/examples/webgpu_clearcoat.html b/examples/webgpu_clearcoat.html
index 7e805d8c8b3427..0f8c37c5589944 100644
--- a/examples/webgpu_clearcoat.html
+++ b/examples/webgpu_clearcoat.html
@@ -42,7 +42,6 @@
 			let group;
 
 			init();
-			animate();
 
 			function init() {
 
@@ -187,6 +186,7 @@
 				renderer = new WebGPURenderer( { antialias: true } );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.setAnimationLoop( animate );
 				container.appendChild( renderer.domElement );
 
 				//
@@ -227,8 +227,6 @@
 
 			function animate() {
 
-				requestAnimationFrame( animate );
-
 				render();
 
 				stats.update();
diff --git a/examples/webgpu_instance_points.html b/examples/webgpu_instance_points.html
index 44f263f8735e41..e5370261848fcb 100644
--- a/examples/webgpu_instance_points.html
+++ b/examples/webgpu_instance_points.html
@@ -54,7 +54,6 @@
 			let insetHeight;
 
 			init();
-			animate();
 
 			function init() {
 
@@ -69,6 +68,7 @@
 				renderer = new WebGPURenderer( { antialias: true } );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.setAnimationLoop( animate );
 				document.body.appendChild( renderer.domElement );
 
 				scene = new THREE.Scene();
@@ -161,8 +161,6 @@
 
 			function animate() {
 
-				requestAnimationFrame( animate );
-
 				stats.update();
 
 				// main scene
diff --git a/examples/webgpu_lines_fat.html b/examples/webgpu_lines_fat.html
index dd12a97f5031d4..f306dd6d986712 100644
--- a/examples/webgpu_lines_fat.html
+++ b/examples/webgpu_lines_fat.html
@@ -52,7 +52,6 @@
 			let insetHeight;
 
 			init();
-			animate();
 
 			function init() {
 
@@ -68,6 +67,7 @@
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setClearColor( 0x000000, 0.0 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.setAnimationLoop( animate );
 				document.body.appendChild( renderer.domElement );
 
 				scene = new THREE.Scene();
@@ -173,8 +173,6 @@
 
 			function animate() {
 
-				requestAnimationFrame( animate );
-
 				stats.update();
 
 				// main scene
diff --git a/examples/webgpu_loader_gltf_sheen.html b/examples/webgpu_loader_gltf_sheen.html
index fd16c319d21c6e..fcafbff7c99c62 100644
--- a/examples/webgpu_loader_gltf_sheen.html
+++ b/examples/webgpu_loader_gltf_sheen.html
@@ -43,7 +43,6 @@
 			let camera, scene, renderer, controls;
 
 			init();
-			animate();
 
 			function init() {
 
@@ -84,6 +83,7 @@
 				renderer = new WebGPURenderer( { antialias: true } );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.setAnimationLoop( animate );
 				renderer.toneMapping = THREE.ACESFilmicToneMapping;
 				renderer.toneMappingExposure = 1;
 				container.appendChild( renderer.domElement );
@@ -126,8 +126,6 @@
 
 			function animate() {
 
-				requestAnimationFrame( animate );
-
 				controls.update(); // required if damping enabled
 
 				render();
diff --git a/examples/webgpu_video_panorama.html b/examples/webgpu_video_panorama.html
index c534ce64ca14ea..1557882dc34d01 100644
--- a/examples/webgpu_video_panorama.html
+++ b/examples/webgpu_video_panorama.html
@@ -52,7 +52,6 @@
 			const distance = .5;
 
 			init();
-			animate();
 
 			function init() {
 
@@ -87,6 +86,7 @@
 				renderer = new WebGPURenderer( { antialias: true } );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.setAnimationLoop( animate );
 				container.appendChild( renderer.domElement );
 
 				document.addEventListener( 'pointerdown', onPointerDown );
@@ -139,7 +139,6 @@
 
 			function animate() {
 
-				requestAnimationFrame( animate );
 				update();
 
 			}