<div dir="ltr"><div><br></div>One other issue could be that everything (menus, palettes, blocks, drawing, ...) in TurtleJS are drawing objects. So you don't use any HTML elements that the browser is probably optimized to handle.<div>I guess it could be more efficient to don't rely only on Easeljs/Canvas but also to mix it with true HTML elements like buttons, images, ...</div><div><br></div><div> Lionel.</div><div><br><div><br><div><div class="gmail_extra"><br><div class="gmail_quote">2016-06-22 23:01 GMT+02:00 <span dir="ltr"><<a href="mailto:sugar-devel-request@lists.sugarlabs.org" target="_blank">sugar-devel-request@lists.sugarlabs.org</a>></span>:<br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><br>
<br>
I've been using Easeljs for Turtle Blocks JS and have for the most part<br>
been ignoring the performance issues. It works really well for separating<br>
the blocks, buttons, etc. from the actual graphics drawn by the Turtle. But<br>
I am at the point where the turtle graphics performance is not adequate.<br>
<br>
The problem is, each time I draw, the accumulated rendering gets redrawn,<br>
so over time, the turtle crawls along. Further, even when I first start<br>
drawing, the performance is more than 100% slower than drawing directly to<br>
the canvas.<br>
<br>
I'm doing what I think it recommended practice by Easeljs:<br>
<br>
turtleCanvas = new createjs.Shape();<br>
stage.addChild(turtleCanvas);<br>
<br>
various calls of the sort:<br>
<br>
turtleCanvas.graphics.moveTo<br>
turtleCanvas.grpahics.lineTo<br>
<br>
I've trted using cache to cache the shape, but that seems to be even slower.<br>
<br>
Just writing to the canvas context is much faster, but I don't know how to<br>
combine the two worlds.<br>
<br>
Any suggestions?<br>
<br>
The code in question is in turtle.js in<br>
<a href="http://github.com/walterbender/turtleblocksjs/js" rel="noreferrer" target="_blank">github.com/walterbender/turtleblocksjs/js</a><br>
<br>
-walter<br>
<br></blockquote></div></div></div></div></div></div>