O'Reilly logo

HTML5 Canvas Cookbook by Eric Rowell

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating an Animation class

As the HTML5 canvas API doesn't provide methods for animation, we'll have to create our own Animation class for handling an animation stage. This recipe will cover the basics of animation and provide an Animation class for all of our future animation projects.

Getting ready...

As browsers and computer hardware are not created equally, it's important to understand that the optimal FPS (Frames Per Second) value for each animation varies depending on the browser, the computer's hardware, and the animation's algorithm. Therefore, it would be quite difficult for a developer to figure out what the best FPS value is for each user. Fortunately, browsers are now implementing a requestAnimationFrame method of the window object ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required