How to make the graph faster?


I am evaluating GoXam graph for Silverlight 4 and met an issue where graph with about 450 nodes is constructed near 10 seconds. Such a performance gap looks strange. Maybe there are some options I need to set to improve the performance, I’d like to know.

I didn’t find a way to attach example to the forum post or support request so I put it there:

In two words, the example contains graph where each node up to level 3 is a graph (linked lists in example but in general they are graphs so I am using LayeredDigraphLayout). So each node is a group, which contains subgraph. If I use the same layout for each node (just comment out everything except last return in Step.LevelName property in Home.xaml.cs file) the graph is created quite fast. But it looks ugly (tall and narrow). So I tried to use different graph direction for each level (the first horizontal, the second vertical, etc) and hit the performance issue.

Could you help me?

Thanks for the sample app. It normally takes about 8 seconds on my machine.

I couldn’t find any real problems with it, so I didn’t see any obvious optimizations.

Changing the Step.LevelName property to always return “Process” didn’t make loading the diagram any faster for me, so I cannot explain why it was so fast for you.

Thank you. If I always return “Process” graph loaded in 2 seconds but if I return different names graph is loaded in 10 seconds. It is sad to hear that you cannot reproduce this behavior as it means there is no way for me to have different graph directions which will load in 2 seconds.

But in any case, 8-10 seconds of graph loading is ok if I show some progress to the users. As I understand layout can be done only in UI thread so it blocks an application UI. Is there any way I can show that something is working, some callback maybe, from which I can update progress bar, or something else?

I suppose you could replace the Diagram.PartManager with a custom PartManager that overrides the PartManager.OnNodeAdded method. (Be sure to call the base method.) That will get called for each new Node that is created.

If this is as large/slow as your diagrams are going to get, I think this will be OK for your users. But if they might get much bigger, you might want to rethink your presentation strategy.

I thought this example diagram was already too big to really understand. I wanted to zoom out to see everything at once, but you have disabled that. That’s OK, and that even has its advantages, but I think you should consider having the most deeply nested Groups be collapsed by default. They would create their subgraphs on demand when they are first expanded.

The Grouping sample in our demo exhibits this behavior.

Thank you for your suggestions. I have plans to enable group collapsing, this example was a test of “Expand All” functionality.

However default collapsed groups don’t work as I expected. Here is slightly modified example:

All groups should be collapsed by default and there is a button to expand them. The only difference with Grouping example is that I load all nodes and links to the model at once (the performance is good enough to not complicate logic by load on demand). But if you try to expand groups you will see that some groups are collapsed by default as they should, but some of them are expanded. It seems as a bug, is there any workaround?

The other issue with the attached example is that nodes (groups) with horizontal graph direction are placed not on single line but at different levels (you need to collapse all “Feed…” nodes to see that). So linked lists in the example looks strange. Are there any options in the LayeredDigraphLayout so nodes will be good aligned?

I haven’t had the chance to download your second app yet.

I’m not sure what you mean and what you want regarding the alignment of the nodes. Perhaps what you want is to specify the go:Node.LocationSpot=“Center” in the Node DataTemplate, on the root visual element of the template.

I am not able to make a screenshot now but here is that I mean:

1 is how the nodes are aligned in the group

2 is how I would like them to be aligned

Does the go:Node.LocationSpot=“Center” work in group template or only in node template? If I have not a linked list but a graph with more than one node at a level will they be correctly placed when they both have go:Node.LocationSpot=“Center”?

In the unmodified app that you sent me, everything basically lines up as I would have expected.

But I do see that upon the first expansion that the first nested group is collapsed, whereas all of the other groups are initially expanded. I can investigate.

Thank you. In my real application several groups are initially collapsed, so it is not always only the first. But I expect them all to be initially collapsed.

In the second example app, if you collapse all “Feed…” nodes manually they will be aligned as in the image 1, i.e. collapsed “Feed…” groups will not be aligned in line. So I would like to know how to setup layout so it place them as in image 2.

Edited: It seems that initial layout places collapsed and expanded groups to the line, but when you start to collapse expanded groups the “line” layout become broken.

Hello Walter,

Excuse me if am too annoying but I have to finalize my investigation of GoXam and decide would we buy it. Could you provide some status of my issues?

I found a workaround of wrong initially expanded groups. I added custom PartManager with the following method in it:

protected override void OnNodeAdded(Node node) <br />{ <br /> if (node is Group) <br /> { <br /> var group = (Group) node; <br /> var data = (Step) node.Data; <br /> group.CollapseSubGraph(); <br /> if (data.LVL < 4) <br /> { <br /> group.IsExpandedSubGraph = true; <br /> } <br /> } <br /> base.OnNodeAdded(node); <br />}

This allows me to have first 2 levels expanded and all the rest collapsed. Setting IsExpandedSubGraph to false there doesn’t help, but calling CollapseSubGraph() helps.

Regarding the “floating” nodes as shown on image 1 I found the following. With the help of custom PartManager I now have all “Feed…” (3rd level) nodes collapsed and initially the layout is ok (as on image 2). But if I expand any “Feed…” node and collapse it back the “line” layout is broken. Moreover, all nodes that are on the screen are placed correctly, but the nodes that are right behind the screen border when you collapse the group are shifted up or down.

And I found another issue. If you make the browser window small, expand and then collapse any “Feed…” group, the graph will be placed incorrectly, it will be started behind the screen borders so the first node become invisible.

Thank you for your help.

I sent you e-mail yesterday.

I think your work-around results in a design for your application that is more usable that what you had done originally.

We are already investigating both of the other issues you have discovered.