It should come with a warning that its gonna peg a cpu on my macbook with firefox. Google is my homepage. I don't expect to lose half my battery by opening firefox and stepping away for 20 minutes.
I've tried gadgets like this many times (though nothing as cool as that buckyball) and it's been my experience every time. It's slow because it's just HTML and CSS.
It's very fast for me on Chrome for Windows but the fan kicked in as soon as I opened the page. Looking at the Chrome task manager it's using a huge proportion of the CPU compared to other tabs.
Emulated 3D - similar to how oldschool NES/SNES games did "3D" games. Each sprite is simply scaled down to make it appear further away. Transforms are used as well for the rotation of the node joints. The hardest part of all this is probably just the z-order business (the z-axis stacking).
To expand on how the joints rotate: the CSS styles use a translation of a large CSS sprite image, which consists of 90 stacked images of the joint at various stages of rotation over 180 degrees. Even older browsers that only support translation transforms will work just as well. (Angles must be rounded to the nearest 2 degrees, which would explain some jumpiness.)
25 comments
[ 4.0 ms ] story [ 73.9 ms ] threadI was a bit surprised that they didn't use canvas, which seems to be all the rage these days. I'm assuming this implementation, however, works on IE.
Just to be clear.
I meant that they refrained from using canvas/svg/flash.
I've tried gadgets like this many times (though nothing as cool as that buckyball) and it's been my experience every time. It's slow because it's just HTML and CSS.
But yeah, it is a little waste full for something like googles home page.
CSS sprites