Стабилизация кадров в секунду RequestAnimationFrame
RequestAnimationFrame (rAF) стал преобладающим средством для анимации, обеспечивая плавное и эффективное выполнение. Однако контролировать частоту кадров (FPS) для обеспечения согласованности может быть непросто.
Регулирование rAF до определенного значения FPS
Чтобы ограничить rAF до определенного значения FPS, вы можете время кредитного плеча, прошедшее с момента выполнения последнего кадра. Ваш код рисования будет выполняться только по истечении желаемого интервала FPS.
Фрагмент кода
Инициализируйте переменные таймера и запустите анимацию:
var stop = false;
var frameCount = 0;
var fps, fpsInterval, startTime, now, then, elapsed;
function startAnimating(fps) {
fpsInterval = 1000 / fps;
then = Date.now();
startTime = then;
animate();
}
Цикл rAF для рисования с заданной частотой кадров:
function animate() {
requestAnimationFrame(animate);
now = Date.now();
elapsed = now - then;
if (elapsed > fpsInterval) {
then = now - (elapsed % fpsInterval);
// Your drawing code goes here
}
}
Включив эту логику, вы можете эффективно регулировать RAF для достижения желаемого FPS, обеспечивая согласованность анимации, отвечающую вашим конкретным требованиям.
Отказ от ответственности: Все предоставленные ресурсы частично взяты из Интернета. В случае нарушения ваших авторских прав или других прав и интересов, пожалуйста, объясните подробные причины и предоставьте доказательства авторских прав или прав и интересов, а затем отправьте их по электронной почте: [email protected]. Мы сделаем это за вас как можно скорее.
Copyright© 2022 湘ICP备2022001581号-3