scrollability icon indicating copy to clipboard operation
scrollability copied to clipboard

Use requestAnimationFrame instead of setInterval, save cpu cycles for animation

Open Tin opened this issue 14 years ago • 5 comments

Use requestAnimationFrame instead of setInterval, save cpu cycles for animation when this api is available. This helps slowly android browsers a bit.

Tin avatar Jun 01 '11 16:06 Tin

another option, which combines both (requstAnimationFrame and setInteral) is described by Joe Lambert: http://blog.joelambert.co.uk/2011/06/01/a-better-settimeoutsetinterval/

rsaccon avatar Jun 19 '11 11:06 rsaccon

@rsaccon the code in question can also be found/forked here: https://gist.github.com/1002116

It offers the performance improvements of requestAnimationFrame (when available) but doesn't require a code refactor to explicitly support it.

joelambert avatar Jun 21 '11 18:06 joelambert

A few feedbacks: adding this really slows down the scrollability at least on Android devices.

After a bit of investigations, I :

  1. Used simple variables and passed the check as argument: var requestAnimFrame = function( jsRequestAnimFrame ) { if ( !jsRequestAnimFrame ) { return ... } else { return ... } }( window.webkitRequestAnimationFrame || window.... ); and of course included it in the scrollability scope ( like Tin patch )

  2. Plus inside requestAnimFrame and requestInterval, replace respectively window.setTimeout by setTimeout, and window.setInterval by setInterval.

It looks to works as it used to be, a little bit better on Android ( maybe because of 1000 / 16 instead of 0 as period ? ) Actually nobody mentions it's not supported on iOS, neither on Android at the moment. *

  • Looks promising on the press release from March... or some chrome / other webkit upcoming releases...
  • At the time of writing, tested with iOS 4.3.X and Android 2.1 - and since the time of scrollability was released, it hasn't changed so much: no support on mobile webkit-based browser for requestAnimationStuff

Snif snif

ghost avatar Sep 05 '11 04:09 ghost

We are facing serious performance issue in android too, especially the honeycomb on tablet. We need a big breakthrough, but seems we are blocked by lacking of hardware acceleration for css3 transformation.

Tin avatar Sep 07 '11 06:09 Tin

my solution is to not support android ;)

chrisdrackett avatar Nov 30 '11 20:11 chrisdrackett