search

Murali-group / GraphSpace

The interactive graph sharing website.
http://graphspace.org
GNU General Public License v2.0
30 stars 41 forks source link

Improve performance on large networks #371

Open jlaw9 opened 6 years ago

jlaw9 commented 6 years ago

A network I posted with 170 nodes and ~5000 edges takes ~30 seconds to load and causes the browser to hang a couple of times. Selecting nodes also takes a couple of seconds. This graph is a little larger than other graphs on GraphSpace, but still seems like something cytoscape JS should be able to handle.

Upon inspecting the CYJS and JSON exported from graphspace, it appears the edge styles are listed twice. Once in the data section of the CYJS file, and once in the layout JSON with a selector for each edge. I tried removing the individual edge styles in the JSON file and the graph loads much faster. Removing the edge styles from the CYJS didn't seem to make much of a difference (see html examples in the zip file performance-tuning.zip).

We need to re-visit how we're handling the styles for nodes and edges. Seems like we should be able to use the style in the CYJS file when a user uploads a graph rather than use a selector to set the style for every node and edge individually. If that doesn't work, we could use a single edge/node selector for styles they all have in common with a mapping to a data property for things like edge width or node opacity.

jlaw9 commented 6 years ago

The cytoscape js cola graph example has some great examples of selectors in the cy-style.json file.