diff --git a/files/en-us/web/api/canvas_api/tutorial/basic_animations/index.md b/files/en-us/web/api/canvas_api/tutorial/basic_animations/index.md index 19687f88087470f..687dbd8ed0ba250 100644 --- a/files/en-us/web/api/canvas_api/tutorial/basic_animations/index.md +++ b/files/en-us/web/api/canvas_api/tutorial/basic_animations/index.md @@ -40,7 +40,7 @@ First there's the {{domxref("setInterval()")}}, {{domxref("setTimeout()")}}, and - {{domxref("Window.requestAnimationFrame()", "requestAnimationFrame(callback)")}} - : Tells the browser that you wish to perform an animation and requests that the browser call a specified function to update an animation before the next repaint. -If you don't want any user interaction you can use the `setInterval()` function which repeatedly executes the supplied code. If we wanted to make a game, we could use keyboard or mouse events to control the animation and use `setTimeout()`. By setting {{domxref("EventListener")}}s, we catch any user interaction and execute our animation functions. +If you don't want any user interaction you can use the `setInterval()` function, which repeatedly executes the supplied code. If we wanted to make a game, we could use keyboard or mouse events to control the animation and use `setTimeout()`. By setting listeners using {{domxref("Window.addEventListener", "addEventListener()")}}, we catch any user interaction and execute our animation functions. > **Note:** In the examples below, we'll use the {{domxref("window.requestAnimationFrame()")}} method to control the animation. The `requestAnimationFrame` method provides a smoother and more efficient way for animating by calling the animation frame when the system is ready to paint the frame. The number of callbacks is usually 60 times per second and may be reduced to a lower rate when running in background tabs. For more information about the animation loop, especially for games, see the article [Anatomy of a video game](/en-US/docs/Games/Anatomy) in our [Game development zone](/en-US/docs/Games).