So you got into Web Based Animations or Games (using that HTML5 thingie) and chances are high that you’re relying on setInterval, setTimeout or even better – requestAnimationFrame to reflow and repaint your frames (fancy terms for rendering each animation frame). Precisely, you’re basing your animations or game mechanics on the frame rate. There’s nothing wrong with that, but let me show you a more sophisticated approach which can actually enhance all sorts of user experience – time based animations.
Continue reading “Time Based Animations in HTML5 Games: Why and How to Implement them”
Tag: requestAnimationFrame
Controlling the Frame Rate with requestAnimationFrame
Limiting the frame rate while using requestAnimationFrame can be a common want especially when coding Games where you want your animations and mechanics to not exceed a particular mark of frames per second. Let’s go through 2 ways of doing it.
Continue reading “Controlling the Frame Rate with requestAnimationFrame”
Cancel CSS3 and JS Animations to Prevent High Memory and CPU Consumption
So you got your creations gallery up on your site and shared the link on some social networks like twitter and facebook. Your loyal fans clicked your link and ended up crashing their browser. OMG! What happened ? Did you have any experiment with lots of amazing CSS3 and JS animations ? Most probably, that’s what happened then. Your experiments were awesome enough to eat up all the RAM and CPU and what not of your fan’s computer and crash it eventually.
Continue reading “Cancel CSS3 and JS Animations to Prevent High Memory and CPU Consumption”