Update index.html

index.html

@@ -194,10 +194,11 @@
         const weaponInfo = document.getElementById('weaponInfo');
         const countdownEl = document.getElementById('countdown');
         const bossButton = document.getElementById('bossButton');
-        // 게임 상태 변수들 바로 아래에 추가
-        const FPS = 60;  // 목표 FPS
-        const frameDelay = 1000 / FPS;  // 프레임당 시간 (약 16.67ms)
-        let lastFrameTime = 0;  // 마지막 프레임의 시간을 저장
+        // 게임의 기본 상태 변수들 근처에 추가
+        let lastFrameTime = 0;         // 마지막 프레임이 실행된 시간
+        const FPS = 60;               // 목표 FPS
+        const frameDelay = 1000 / FPS; // 프레임 사이의 간격 (16.67ms)
+        let deltaTime = 0;            // 프레임 간의 시간 차이
         canvas.width = window.innerWidth;
         canvas.height = window.innerHeight;
 
@@ -1265,23 +1266,38 @@ function updateBF109Damage() {
 }
     function gameLoop(timestamp) {
         if (!gameOver && gameStarted) {
-            // 현재 프레임과 이전 프레임의 시간 차이 계산
-            const elapsed = timestamp - lastFrameTime;
-    
-            // frameDelay(16.67ms)보다 더 많은 시간이 지났는지 확인
-            if (elapsed > frameDelay) {
-                // 마지막 프레임 시간 업데이트
-                lastFrameTime = timestamp - (elapsed % frameDelay);
-                
-                // 게임 업데이트 및 그리기
-                updateGame();
-                drawGame();
+        // 첫 프레임일 경우 시간 초기화
+        if (!lastFrameTime) {
+            lastFrameTime = timestamp;
+        }
+
+        // 현재 프레임과 이전 프레임의 시간 차이 계산
+        deltaTime = timestamp - lastFrameTime;
+
+        // 16.67ms(60FPS)가 지났는지 확인
+        if (deltaTime >= frameDelay) {
+            // 업데이트할 프레임 수 계산
+            const numUpdates = Math.floor(deltaTime / frameDelay);
+            
+            // 한번에 너무 많은 업데이트 방지 (최대 3프레임)
+            const maxUpdates = 3;
+            
+            // 게임 상태 업데이트
+            for (let i = 0; i < Math.min(numUpdates, maxUpdates); i++) {
+                updateGame(frameDelay / 1000);
             }
             
-            // 다음 프레임 요청
-            requestAnimationFrame(gameLoop);
+            // 화면 그리기
+            drawGame();
+
+            // 마지막 프레임 시간 업데이트
+            lastFrameTime = timestamp - (deltaTime % frameDelay);
         }
+
+        // 다음 프레임 요청
+        requestAnimationFrame(gameLoop);
     }
+}
       class Enemy {
     constructor(isBoss = false) {
         this.x = Math.random() * canvas.width;