diff --git a/js/entities/player.js b/js/entities/player.js index 9fccfff..c14d45f 100644 --- a/js/entities/player.js +++ b/js/entities/player.js @@ -177,9 +177,9 @@ class Player extends Entity { const targetOffsetX = this.x - (canvas.width / PIXEL_SIZE / 2); const targetOffsetY = this.y - (canvas.height / PIXEL_SIZE / 2); - // Smoothly move the camera to the target position - worldOffsetX += (targetOffsetX - worldOffsetX) * 0.1; - worldOffsetY += (targetOffsetY - worldOffsetY) * 0.1; + // Smoothly move the camera to the target position (reduced smoothing factor) + worldOffsetX += (targetOffsetX - worldOffsetX) * 0.05; + worldOffsetY += (targetOffsetY - worldOffsetY) * 0.05; // Mark that the world has moved for rendering worldMoved = true; diff --git a/js/main.js b/js/main.js index fb3361e..b9b8397 100644 --- a/js/main.js +++ b/js/main.js @@ -94,6 +94,10 @@ function spawnPlayer() { // Hide HUD elements document.querySelector('.controls').style.display = 'none'; + // Resize canvas to full screen first + canvas.width = window.innerWidth; + canvas.height = window.innerHeight; + // Set zoom level to 50% PIXEL_SIZE = 2; @@ -105,9 +109,8 @@ function spawnPlayer() { worldOffsetY = player.y - (canvas.height / PIXEL_SIZE / 2); worldMoved = true; - // Resize canvas to full screen - canvas.width = window.innerWidth; - canvas.height = window.innerHeight; + // Clear chunk cache to force redraw at new zoom level + chunkCanvasCache.clear(); // Remove the event listener for the spawn button to prevent multiple spawns document.getElementById('spawn-player-btn').removeEventListener('click', spawnPlayer); @@ -128,8 +131,10 @@ function simulationLoop(timestamp) { // Update physics with timestamp for rate limiting updatePhysics(timestamp); - // Render - render(); + // Render - skip rendering if FPS is too low to prevent death spiral + if (fps > 10 || timestamp % 3 < 1) { + render(); + } // Memory management: Clean up chunk cache for chunks that are far away if (timestamp % 5000 < 16) { // Run every ~5 seconds diff --git a/js/render.js b/js/render.js index fb42211..bedd6dd 100644 --- a/js/render.js +++ b/js/render.js @@ -9,8 +9,8 @@ function render() { // Draw animated sky background renderSky(); - // Get visible chunks - const visibleChunks = getVisibleChunks(); + // Get visible chunks - limit the number of chunks processed per frame + const visibleChunks = getVisibleChunks().slice(0, 20); // Render each visible chunk for (const { chunkX, chunkY, isVisible } of visibleChunks) {