canvas - performance of layered canvases vs manual drawImage() -
i've written small graphics engine game has multiple canvases in tree(these represent layers.) whenever in layer changes, engine marks affected layers "soiled" , in render code lowest affected layer copied parent via drawimage(), copied parent , on root layer(the onscreen canvas.) can result in multiple drawimage() calls per frame prevents rerendering below affected layer. however, in frames nothing changes no rendering or drawimage() calls take place, , in frames foreground objects move, rendering , drawimage() calls minimal.
i'd compare using multiple onscreen canvases layers, described in article:
http://www.ibm.com/developerworks/library/wa-canvashtml5layering/
in onscreen canvas approach, handle rendering on per-layer basis , let browser handle displaying layers on screen properly. research i've done , i've read, seems accepted more efficient handling manually drawimage(). question is, can browser determine needs re-rendered more efficiently can, despite insider knowledge of has changed each frame?
i know answer question "do both ways , benchmark." in order accurate data need real-world application, , months away. if have acceptable approach have bigger fish fry. i'm hoping has been down road , can provide insight this.
the browser cannot determine when comes canvas element , rendering passive element - in user rendered means of javascript. thing browser pipe what's on canvas display (and more annoyingly clear time time when bitmap needs re-allocated).
there unfortunately no golden rule/answer best optimization vary case case - there many techniques mentioned merely tools can use still have figure out right tool or right combination of tools specific case. perhaps layered in 1 case , perhaps doesn't bring case.
optimization in general in-depth analysis , break-down of patterns specific scenario, isolated , optimized. process if experiment, benchmark, re-adjust, experiment, benchmark, re-adjust, experiment, benchmark, re-adjust... of course experience reduce process minimum experience specifics comes in variety of combinations still require fine-tuning case case (given not identical).
even if find recipe current project not given work optimal next project. 1 reason no 1 can give exact answer question.
however, when comes canvas want achieve minimum of clear operations , minimum areas redraw (drawimage or shapes). point layers groups elements enable goal.
Comments
Post a Comment