Update: I’ve checked it in Firefox 3.6.6 and to my surprise it works perfectly.
With the maturing of Direct2D support in Firefox I feel that it’s time to revisit transformations. Transformations let you rotate, skew and so on arbitrary elements on a page. They are relatively slow to do in software but really fast in hardware.
After a long discussion that I had recently, I should point out that this is a DEMO, meaning that it’s supposed to show what you CAN do with HTML+Transformations, rather than what you SHOULD do. A demo is not useful on it’s own, it’s just meant to illustrate a concept.
In this case, it shows a very simple approach to doing free-form deformation of bitmaps. I tried it in pure HTML+JS+CSS here, but the concept and quickly and easily be applied to other drawing systems like Canvas2D, where it could be used to provide a fallback for WebGL.
Neat demo, I like it. A bit slow in FFX, imperfect in Opera and broken in Webkit, but still a fine one! 😉
Nice 😀
Sorry for the delay… WordPress’ spam filter got a bit over-eager (no wonder with the amount of spam coming in). Looks like Opera does a lot of rounding which is OK for a browser that also targets mobile devices. As for WebKit… to be honest, I’ve pretty much given up on this rendering engine: It may be fast, it may be portable and it may have a lot of cool extensions, but at the end of the day it’s really buggy. WebKit’s developers apparently rarely take the time to implement something correctly if it doesn’t generate headlines for them.
P.S. With Direct2D enabled it really runs at the speed you can see in the video, even on my old hardware.