"Task" in Chrome's JavaScript profiler taking longer, but no functions being called

Question

I'm writing a game in JavaScript and having performance problems. The program starts a timer, then in the callback renders a frame of the graphics and starts another timer for the next frame. The main function just returns after starting the timer. It starts off fine, but my timer callback is being fired off at longer and longer intervals.

When viewing the calls in Chrome's performance profiler, when the program initially starts running I can see that my timeout callback is completing with plenty of time left over.

Timer function called at correct interval

The "Task" bar stays active for a short time after my timer function returns, and there is idle time between timer calls. However, after running for a few minutes, the "Task" part of the program starts getting longer and longer.

Long delay in Task after timer function returns

The timeout function is still completing quickly in the same amount of time, and there isn't any of my code executing outside of the timer interval. Is there a way to find out what is going on in the "Task" part of the profiler, or even better, any ideas on what would cause this?

Thanks.

Answer 1

The problem wound up being doing a canvas context save() twice in a function rather than a save() and restore(). The surprising thing is that it didn't show up as a increase in memory use. Garbage collection was running every few seconds and restoring to the same amount, but the "Task" function call in the profiler was taking longer and longer. Even stranger that it was in the return from my timer function and not in something like the layer tree or composing task functions.