vasturiano / 3d-force-graph

3D force-directed graph component using ThreeJS/WebGL
https://vasturiano.github.io/3d-force-graph/example/large-graph/
MIT License
4.8k stars 831 forks source link

updateGeometries memory leak #99

Open mys opened 6 years ago

mys commented 6 years ago

Focusing at Highlight nodes/links (source) we can see that every .onNodeHover and .onLinkHover sends

Graph.nodeRelSize(4); // trigger update of 3d objects in scene

to redraw the nodes/links. Looking at Chrome Task Manager every nodeRelSize() call grows RAM usage by a few megabytes. In my own visualization example I have hundreds of nodes and every call eats 50+ MB of RAM. I am using custom .nodeThreeObject also. Is there any lighter call to update the nodes/links look?

mys commented 6 years ago

I have found workaround which is brilliant and most efficient, because it updates only modified nodes/links and immediately.

.onNodeHover(node => {
  node.__threeObj.parent <- (FromKapsule)
}

This is same as going through Graph.scene().children[(FromKapsule)] FromKapsule children gives us access to all nodes and links in the Scene. I can modify chosen element (color, position or add new mesh) and it is saved and rendered without redrawing whole scene. I will try to prepare Example how to use that because it could be an answer to some of questions (#26, #38, #39, #42, #61) where we deal with huge amount of data.

lucacinelli commented 6 years ago

@mys I am very interested in this topic. I hope that there will be developments and examples in this regard. I also make use of this library with many nodes and links

mys commented 6 years ago

@lucacinelli @rkalidhindi-tanium https://rawgit.com/mys/3d-force-graph/node_modification/example/node-modification/index.html This is what I was talking about. Without calling memory intensive state.sceneNeedsRepopulating for all other objects.