new icn messageflickr-free-ic3d pan white

Snowstorm, work in progress #2: Hardware-accelerated CSS 2D/3D transforms / stress-testing

Here's Safari running just over 250 individual snowflakes (rendered as a @font-face "webfont"), including opacity, text-shadow and 2D + 3D rotation transform effects. CPU peak was perhaps 75% on an early 2008 Mac Mini.

 

Without acceleration of some sort, numbers like this would not be possible. Animating this many elements simultaneously using JavaScript with CSS transformations is pretty impressive for a browser.

 

It's worth noting that Chrome really chokes on the same full set of glyphs with many points etc., but performs better with a reduced/simplified set.

 

Also, happy holidays! :)

3,648 views
3 faves
8 comments
Uploaded on December 5, 2010