From the course: Vanilla JavaScript: Mobile Game Programming
Unlock the full course today
Join today to access over 22,400 courses taught by industry experts or purchase this course individually.
Introduction to requestAnimationFrame() - JavaScript Tutorial
From the course: Vanilla JavaScript: Mobile Game Programming
Introduction to requestAnimationFrame()
- [Instructor] Before we move on to write the four functions we just called from the start method we need to address the shortcomings of setTimeout and its cousin setInterval. Although both are convenient, they can pose some significant problems especially on low end or mobile platforms. Both functions are resource hogs, eating up processor cycles even when the tab running the animation is invisible. Even worse, this will deplete your mobile users' batteries alarmingly fast. Both functions require a delay in milliseconds set by the developer before executing. The delay establishes the frame rate, or the number of frames per second. Since the frame rate for all devices can't be known compromises must be made to make the animation good enough instead of the best it can be. The result is often choppy animations because the browser can't accommodate the frame rate set by the developer. When set timeout fires sometimes the browser isn't ready to redraw the screen, so the frame is skipped…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.