Javascript game; замедление и замораживание! Как его решить?

Я начинаю программировать защиту башни javascript; пока у меня есть движение миньонов по траектории. Но у меня очень большие проблемы, игра внезапно замерзает на пару секунд. Я предполагаю, что сборщик мусора, выполняющий свою работу, любые идеи о том, как я могу решить это, будут очень хорошими, так как я планирую добавить в игру намного больше элементов, и я не хочу продолжать кодирование, пока не получу это прекрасно!Javascript game; замедление и замораживание! Как его решить?

Код до сих пор довольно прост; Вы можете проверить это here

Вот код:

<html> 
<head> 
    <style> 
     #game{ 
      background:red; 
      width:500px;    
      height:500px;   
      position:relative;   
     } 
     .mostro { 
      background:black; 
      width:15px;   
      height:15px;    
      position:absolute;   
     } 
    </style> 
</head> 
<body> 
<div id="game"> 
<script type="text/javascript"> 
waypoint_x = [40, 140, 140, 220, 220, 80, 80, 340, 340, 420, 420]; 
waypoint_y = [140, 140, 60, 60, 240, 240, 320, 320, 100, 100, -20]; 
delay = 25; 
new_monster = 0; 
monsters_placed = 0; 
monsters = []; 
var d = new Date(); 
dist_x = 0; 
dist_y = 0; 
angle = 0; 
mostro=""; 
total_monsters = 5; 
function runGame() { 
    if (monsters_placed<total_monsters) { 
     new_monster++; 
    } 
    if (new_monster == delay) { 
     new_monster = 0; 
     document.getElementById("game").innerHTML = document.getElementById("game").innerHTML + '<div class="mostro" id="mostro-'+monsters_placed+'"></div>'; 
     monsters_placed++; 
    } 
    for (i=0;i<monsters_placed;i=i+1) { 
      mostro = monsters[i]; 
      dist_x = waypoint_x[mostro.point_to_reach] - mostro._x; 
      dist_y = waypoint_y[mostro.point_to_reach] - mostro._y; 
      if ((Math.abs(dist_x) + Math.abs(dist_y)) < 1) { 
       monsters[i].point_to_reach++; 
      } 
      angle = Math.atan2(dist_y, dist_x); 
      mostro._x = mostro._x + mostro.speed * Math.cos(angle); 
      mostro._y = mostro._y + mostro.speed * Math.sin(angle); 
      monsters[i]._rotation = angle/Math.PI*180-90  
     document.getElementById("mostro-"+i).style.left = Math.ceil(mostro._x) + "px"; 
     document.getElementById("mostro-"+i).style.top = Math.ceil(mostro._y) + "px"; 
    } 
} 

function setUpGame(){ 
    for(i=0;i<=total_monsters;i++){ 
     monsters[i] = new Object(); 
     monsters[i].point_to_reach = 0; 
     monsters[i].speed = 1; 
     monsters[i]._x = 0; 
     monsters[i]._y = 0; 
    } 
} 
setUpGame(); 
setInterval(runGame,10); 
</script> 
</body> 
</html>

источник

2009-06-12 DFectuoso

Вы пытались увеличить интервал примерно до 30? – cloudhead

Да, это происходит даже с интервалами в 1000-х годах. – DFectuoso

Его не сборщик мусор делает работу, но в коде, когда вы пытаетесь установить верхние и левые позиции, в particuar времени значения что вы пытаетесь установить не число. Таким образом, код ломается ....

Я думаю, что это происходит, когда движущийся div пересекает верхнюю часть контейнера с красным фоном.

источник

2009-06-12 05:03:02 rahul

Это происходит, прежде чем они покинут фон. Я думал больше о десятичных точках в левом и правом объявлении; позвольте мне проверить это – DFectuoso

Игра очень хорошая .... – rahul

Также проверьте это в IE7. Он генерирует ошибку сценария. – rahul

Да, это правильно: задержка связана с тем, что, когда слишком много монстров, слишком много исправлений положения, которые необходимо выполнить. Это вызывает задержку перезаписи.

Я вижу, что для каждого монстра есть элемент DOM (как и должно быть в случае). Но вы обновляете свои позиции один за другим.

Советы, чтобы уменьшить это отставание:

Во-первых, это было бы лучше СТРАТЕГИЯ обновить свои позиции в массовом порядке:

<div id='monster-container'> 
    <div id='monstser-1'></div> 
    <div id='monstser-2'></div> 
    <div id='monstser-3'></div> 
</div>

Таким образом обновить позицию «# монстр-контейнер», когда монстры переехать. Таким образом, время перерисовки, безусловно, будет сведено к минимуму. То, что я говорю, - это примитивное понимание вашей игры. Возможно, вам придется изменить этот подход в зависимости от пути монстров. Мой подход будет работать напрямую, только если монстры будут двигаться только по прямой.

Во-вторых, если вы используете IMG для монстров, рассмотрите возможность использования Див, и установить изображения в качестве фона в дел. Это привело к более быстрой перерисовке во многих моих домашних играх.
В-третьих, если вы используете отдельные изображения для монстров, рассмотрите возможность использования составного изображения и написания CSS.

Желаю удачи в вашей игре! Ура !!

JRH

источник

2009-06-12 05:15:41 jrharshath

Yea; но мне нужно переместить их один за другим, чтобы сделать игру так, как она мне нужна. Спасибо за другие советы! – DFectuoso

, что легко сделать: переместите их относительно своего контейнера div! Я действительно сталкивался с ними раньше ... И если вы действительно хотите построить интенсивную игру, используйте

Thats a good idea ... hummm hummm – DFectuoso

Да, это, безусловно, сборщик мусора. Я сам разрабатываю JavaScript-игру, и последние несколько дней я пытался избавиться от этой проблемы. До сих пор я могу сказать, что это невозможно.

Однако, я хотел бы отметить, что в разных браузерах разные сборщики мусора, и, например, в Safari 4, ваш пример работает совершенно гладко.

А вот интересную ссылку на эту тему: Reducing freezing with Object Pooling

Честно говоря, я думаю, что метод, описанный в этой статье, не очень полезно, потому что даже в вашем примере, что не имеет каких-либо переменных, необходимых, чтобы быть очищено, замораживание действительно заметно.

Также я переписал ваш пример, чтобы проверить, разрушили ли глобальные переменные производительность. You can see the difference yourself

источник

2009-07-31 10:42:11

Не подбирайте свой ответ как правильный, потому что он не решает проблему, но вы качаете! человек !, отличный ответ, хорошее содержание, понимание проблемы и определенно полезно !!! – DFectuoso

Javascript game; замедление и замораживание! Как его решить?

ответ

Смежные вопросы