CPU usage still high even with paused animations or disabled event listeners

[bashovski]

Describe the bug

Hello, again. So basically, we are experiencing high CPU usage even with a low amount of nodes/edges in the graph.
The graph is unloaded by clearing the graph data:

        this.graphInstance.pauseAnimation();
        this.graphInstance.graphData({
          nodes : [],
          links : []
        });

I've tried resuming the animation and populating the data once a graph should be reloaded, but the result is the same.
We are also requiring the graph to emit those events:

onBackgroundClick
onNodeClick
onLinkClick

We have also applied custom link curvature and we also apply custom canvas objects where needed (only 5-10 have a canvas object which is a basic non-solid text).

Expected behavior
Basically, the graph shouldn't cause high CPU usage since it shouldn't be doing anything unless user interacts with it.

Screenshots
An example of how the graph implementation looks like:
force-graph loading 113 nodes 809 links

Here's the performance monitor (avg. CPU usage without having the graph opened is between 2.5 and 5%):

Desktop (please complete the following information):

• OS: MacOS
• Browser: Chrome
• Version Version 88.0.4324.150 (Official Build) (x86_64)

(also happens on other browsers)

Additional context
I've also posted another issue last year which could be related to this one: issue

Looking forward to hearing from you!

[vasturiano]

@bashovski thanks for your report.

I've added some performance improvements to the rendering cycle that automatically pauses redraws when the force simulation engine is halted. This should bring the cpu usage of the module to a minimum after the cooldown phase.
The default cooldown phase lasts for 15s, if that is too long for your case you can reduce this period via either cooldownTime or cooldownTicks.

Keep in mind the redrawing is only paused if there's no need to visual changes needed in the canvas. For cases which the canvas needs updating, for instance when there are directional particle animations, the redrawing remains active.

It's also possible to bypass this automation altogether, for some custom cases which require continuous redrawing of the canvas, like so:

myGraph.autoPauseRedraw(false)

Let me know if you observe an improvement with this new functionality.