Я не понимаю, почему происходит задержка при выполнении этих функций

Я делаю простую игру, и я просто выбираю позицию касания пользователя и знаю, коснулся ли он объекта или не коснулся его, но оказывается, что если я несколько раз нажимаю на экране, объект начинает делать очень быстрые паузы, это как если бы интервал, который заставляет объект двигаться, когда я касаюсь экрана, но это очень короткая пауза, как я уже говорил:

//En este evento recojo la posición del toque
document.body.addEventListener('touchstart', function(event){
    var yFinger = event.touches[0].clientY; localStorage.yFinger = yFinger;
    var xFinger = event.touches[0].clientX; localStorage.xFinger = xFinger;
}, false);

Что ж, кажется, что когда это событие выполняется сделайте паузу в несколько тысячных долей интервала, который у меня есть в другой функции, которая отвечает за перемещение объекта, здесь я оставляю интервал, в который я перемещаю объект (очевидно, упрощенный и уменьшенный):

//Un sencillo ejemplo de un intervalo moviendo el objeto del top (está en una función diferente)
    var yPos = 0;

    setInterval(function() { 
        yPos = yPos + 10;   
        document.getElementsByClassName("object")[0].style.top = yPos;
    }, 25);

Спасибо за любые помогите, я думаю, что проблема в том случае, если я выбираю позицию касания, но я не знаю, как я мог бы это исправить.

Примечание: на <head> этой страницы я ввел следующее, чтобы устранить 300-миллиметровую задержку браузера на мобильных телефонах: (Я знаю, что она не устраняется только во всех браузерах, но сейчас она того стоит в Chrome)

<meta name="viewport" content="user-scalable=no">

Странно то, что эта проблема в Safari не возникает.

0
задан 02.01.2017, 14:26
0 ответов

Используя функцию window.requestAnimationFrame решается все, таким образом не вынуждается количество изображений в секунду, и браузер может оптимизировать это так что оживление будет гораздо мягче.

Веди, чтобы знать Ваши использования: CSS Tricks

0
ответ дан 03.12.2019, 17:54

setInterval, равно как setTimeout, он не гарантирует тебе, что он будет работать в указанном интервале, но он работает, когда будет возможным прошедший по крайней мере указанное время. Его может быть 25ms, 50 или 200. Возможно тогда, что обрабатывать событие отсрачивает выполнение оставшейся части рукописного шрифта.

Он мог бы предлагать тебе какие-то вещи:

Использовать оживление CSS (transform), таким образом, включается ускорение хардвера, если он доступен.

Если ты только двигаешь объект, используй идентификацию и getElementById, вместо getElementsByClassName.

Использовать другое событие. Если то, что querés состоит в том, чтобы знать, если он коснулся объекта: почему не слушать click или touchstart объекта?

0
ответ дан 03.12.2019, 17:54