12 ms·
Performance has been my focus on this work, I use a lot a cache canvas to not redraws gradient and path things but just copy caches. But i'm stuck on Canvas and
by gren 14y ago
Performance has been my focus on this work, I use a lot a cache canvas to not redraws gradient and path things but just copy caches. But i'm stuck on Canvas and requestAnimationFrame performances. Let's hope it will continue to improve, otherwise I could try to use WebGL but it will not be supported by every browsers for today.
Do you use a lot of sampling in the lights? I reach good fps on my macbook pro, especially on Chrome (but also on my home computer under Linux).
I hope we can use it with less sampling and less compute() calls for our games :)
- Jimmie 14y agoDefault scene, Chrome 18.0.1025.168, Os X 1.6.8, Year old Macbook Pro Runs so slow I can barely drag the objects around. It looks great though, I mean the output is fantastic just not performant.
- gren 14y agoeah I think the default scene use too much samples, like 51 for the right light. Now my technique of combining shadow samples together is probably not the most efficient, I draw them with source-over and an alpha which is also a wrong hacky current implementation... but maybe using the CanvasData would be less efficient (technically I need to make the average of shadow samples' grayscales) - well we never know, I haven't tried yet ;) I would be happy to have any contribution in the library :)
- timb 14y agothe editor could turn down samples for lights while dragging, and turn samples back up when dragging is finished.
- deleted 14y ago[deleted]
- ajuc 14y agoI feel you. I'm doing 2d game in html5 (I have 2 rendering engines - pure canvas, and webgl). Webgl works great, but works on small percentage of browsers, canvas version runs with ~ 45 FPS in 1280x960 on my 2 core celeron 2Ghz. And the main problem is just fill rate - I have background, and scrolling terrain, so I need to clear whole window every frame, and less than 50 (64x64 pixel) sprites at one time on screen. That's already too much for canvas to redraw at 60 FPS.
- de90 14y agoAre you currently prerendering to a separate canvas? Drawing it to a different (hidden) canvas, grabbing the image data, and just pushing that to the actual canvas might be a bit performance boost.
- gren 14y agoThis is what I do except I use drawImage. You think using getImageData and putImageData is more performant that drawImage(canvas, 0, 0) ? BTW i'm not sure it will works for combining images together with special composite operation.
- leeoniya 14y agodrawImage is usually faster. i think it's also more useful if you need alpha composition (overlays). http://jsperf.com/canvas-drawimage-vs-putimagedata/11 http://jsperf.com/canvas-drawimage-vs-putimagedata/11 also read this about imageData caching and explanations of the different opts. loop unrolling helps a bit, forget the typed array stuff for now, it wont work anywhere for some time. http://hacks.mozilla.org/2011/12/faster-canvas-pixel-manipulation-with-typed-arrays/ http://hacks.mozilla.org/2011/12/faster-canvas-pixel-manipul...
- gren 14y agoThanks!
- ajuc 14y ago