Rendering large graphs

[Rage-cmd]

Hey, I was wondering if we can render DAG graphs that have around 20000 nodes using vizdom. Will zooming out or panning be slow then? Can we do something like lazy loading here? In other words, once I have used the 'layout' method, can I add nodes (and edges) again and then call 'layout' to only add the new subgraph and not render the whole thing again?

Just curious about these questions because the graph I plan to render is quite large.

[s0l0ist]

Hey @Rage-cmd, thanks for your questions!

The client library should be able to handle rendering large graphs, even with 20k nodes/edges. I have not rendered a graph that large - it should work, but take several minutes. Layout and positioning will take most of the time.

On vizdom.dev, zooming and panning should generally be smooth since these interactions are GPU-accelerated. However, as the number of nodes and edges increases, performance might start to degrade as the browser handles a large number of SVG elements.

In offline only mode, performance will vary based on how you're viewing the SVG. In my experience, smaller graphs render display just fine when "dragged into Chrome", but for larger graphs (e.g., exporting the "Example 14" graph in the live editor and opening it in Chrome), the experience can be suboptimal.

When it comes to layout and positioning performance, the complexity of the graph is a major factor. The relationships between nodes and the structure of the graph determine how much computational work is needed, and it’s hard to gauge without seeing the actual graph. Optimizing the graph's construction can have a big impact on layout performance, especially with larger or more complex graphs.

Regarding adding nodes and edges after generating the graph, this presents a challenge. The layout algorithms rely heavily on the relative structure of the entire graph, with the order of nodes and edges influencing many layout decisions. Because of this, adding new elements without recalculating the layout could result in inconsistent or incorrect placements.

While Vizdom doesn’t currently support partial layouts, it's something I’m considering for future optimizations. For now, each call to layout recalculates the entire graph, though I'm actively exploring improvements to handle larger graphs more efficiently.

I’d love for you to give it a try and share your experience! I’m really curious myself to see how it performs with such large graphs. If you run into any bottlenecks, feel free to reach out!