profiling GJS/Clutter.Timeline vs Mainloop.timeout_add

[Amy C <mathematical coffee gmail com>]

Hi all,

I have an extension that populates the screen with little animated
toons. The animation is frame-driven, i.e. for each frame, every toon
determines where they will move next and changes their pixmap slightly
to give the appearance of animation.

Now that the extension is mostly working, I'm trying to make it more efficient.
At the moment I drive the animation by using

    Mainloop.timeout_add(delay_between_frames, Lang.bind(this, this.frame))

where this.frame is the code that advances all the toons one step.

I notice that this is sometimes laggy (I can't really reproduce it
though) - the type where you move your cursor across the screen and
can see it pausing every frame before it continues on.

Should I use a Clutter.Timeline for this instead? I like
Mainloop.timeout_add because it allows me to specify the time between
frames and suits a frame-driven animation, whereas a Clutter.Timeline
seems more suited to an animation where you just want it to transition
from state A to state B in x milliseconds, however many frames happen
to fit in that.

Continuing on from that, is there some tool by which I can profile GJS
code? I know there are plenty for JS code but I'm not sure how to
write my code to run standalone what with the various imports
(.gi.{heaps| & .lang, .mainloop), or even if that is possible.

cheers!