Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

Very cool, but a few notes to anyone getting their hopes up on the powers of Canvas:

As you may have anticipated, this demo runs at less than 1 frame per second on my Nexus 7. :/

In terms of per-pixel manipulation of a Canvas, it is very slow, even with javascript's (not very well supported) typed arrays. Simply put, multidimensional loops (unrolled or not) will always kill performance in JS with any significant dimensions. I learned this the hard way by trying to write a pixel-based GUI, and even that (with some crazy optimizations) could not render fast enough for all devices. If you are just doing blits, Canvas works very well (especially since this operation often uses the GPU).

For now, I think the best option is still WebGL, even though it is not widely supported yet, mobile devices are beginning to pick it up (Blackberry, for example).



Runs about 6-7 fps on my iPhone 5.


Nice :) Shows you how fast ARM is progressing...


But only 4-5 fps on my iPad 3. Hmmmph, thought that'd be faster.


My iPhone 5 is considerably smoother and faster than my iPad 3. That's surely also related to the iPad's insane pixel count, but the iPhone also loads and switches apps faster, before CPU-based rendering is a factor.


Note also that he's got his canvas set to half the CSS size, i.e. each canvas pixel is 4 screen pixels on a normal display. On a retina display each canvas pixel will be 16 screen pixels. So if you tried to manipulate real pixels this way on those devices it wouldn't be pretty. (Retina version: http://jsfiddle.net/RFLaW/)




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: