| Summary: | requestanimationframe + hardware acceleration gives jumpy animations | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Koen Bok <koen+bugzilla> |
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW --- | ||
| Severity: | Normal | CC: | dino, simon.fraser, thorton, webkit-bug-importer |
| Priority: | P2 | Keywords: | InRadar |
| Version: | 525.x (Safari 3.2) | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
| URL: | http://jsfiddle.net/ux3rqce0/5/ | ||
When you combine requestanimationframe with hardware acceleration (translate3d), animations get all jumpy. Some other observations: - When you trigger a paint every frame (somewhere on the page) things get smooth again - When you use 2d transforms it's a little better - Something like requestanimationframe(function() {setTimeout(draw, 0)}) seems to work the best for now Example: http://jsfiddle.net/ux3rqce0/5/ I'm using the latest Yosemite GM Safari Version 8.0 (10600.1.25) and I think iOS8 has the same problem although it's harder to observe on retina. On 10.9, everything seems to be OK.