Hi everyone,

I wanted to give you a heads up on some significant updates I've made to Graphics, in the hopes that you can test against your projects and confirm that nothing is broken.

Graphics consists of a queue of instructions: command objects that expose an "exec()" method. Drawing is simply iterating through that queue, and executing each instruction in turn.

Previously, these instructions were generic command objects that used function.apply to get their work done. I have now updated the implementation so that all instructions have dedicated command objects (Ex. Graphics.LineTo).

This has a performance benefit (it facilitates type detection & avoids function.apply), allows introspection of the queue via Graphics.getInstructions(), but perhaps most importantly enables dynamic updating of commands.

For example:
// create and save a fill command object:
var fill = myShape.graphics.beginFill("red").command;
// ditto for a rect:
var rect = myShape.graphics.drawRect(0, 0, 100, 100).command;
// ... then later, we can update them, w/o rebuilding the whole queue:
fill.style = "green";
rect.width *= 2;

It also makes it really easy to create your own custom command objects, and inject them using .append():
myShape.graphics.append({exec:function(ctx2d, shape) {
   // do some custom context2D drawing here.
});

While working on this, I encountered some bottlenecks on Graphics performance when working with large instruction queues (thousands of commands). I've been able to optimize things significantly, so that the overhead in worst case scenarios (drawing LOTS of shapes with different fills/strokes in one Graphics instance) has been reduced by 100x or more. Memory churn has also been reduced in these cases.

In my test case (add 50k rects with different fill colors to a single Graphics instance), it went from ~10s to <20ms.

These changes are up in the NEXT build. Please take a look and let me know ASAP if they break anything for you. They've passed all my base-level tests, but are quite extensive and could use testing.
Shared publiclyView activity