This is an initial attempt to improve the graph’s performance for large number of nodes using web workers. This PR is a work in progress.
The idea here is to off-load the heavy force layout computations to the web worker. This improves performance during page load.
I am also experimenting on passing the logic to web workers during the drag events. This part is still work in progress.
Here is the rough idea that I try to achieve:
In the present situation, when we drag, the force layout restarts the simulation. When there are large no. of nodes, the graph takes a lot of time to achieve equilibrium, thereby dropping the frame rates. Restarting the simulation is necessary, to compute the updated coordinates and give the soft transition, else the drag effect doesn’t appear smooth.
Using web workers, I try to keep the dragged coordinates in the main thread, invoke the web worker during
dragEnd. The web worker computes the updated coordinates and waits until the graph attains equilibrium. I need to figure a way to get the updated coordinates and achieve smooth animations.
Web Workers is a simple means for web content to run scripts in background threads.
A Web Worker is just a general purpose background thread. The intention here is to run background code such that long running tasks do not block the main event loop and cause a slow UI.
Motivation to use web workers for Lightbeam
When we started this project, performance was the key factor and we were happy to see the improvements
canvas did over
svg. Now we are expecting to see huge performance benefits via
Stay tuned for more updates!