Layout help for performance

[kendellfab]

I've been working on porting a small set of functionality from a previous project that I've worked on, from GTK to fyne for the cross platform benefits. The basics of it is a way to cache a graphql schema and inspect it while offline.

There is the potential for a lot of information to be displayed, the GTK version can handle multiple columns (15-20) and resizing with out a problem. But I'm finding that adding 3-5 columns of detail causes the fyne version to become very unresponsive. Moving the split widget lags behind the pointer greatly and the scrolling is not much better.

I'm wondering if there are better ways to lay this out that still could meet my needs. As per the picture*:

Red: DocTabs
Blue: List

Yellow: HBox nested in a scroll
Purple-ish: Border
Teal: VBox inside of scroll
Brown-ish: Border, with a RichText at top and a VBox to hold the properties

I do realize that this is a lot of nested layouts/containers, but it is the way that I could get the layouts to work. I tried putting the properties inside of a list widget, but then the columns collapsed on themselves horizontally and the lists themselves collapsed down to only showing one item at a time. So I tried then to put the brown boxes into a grid with lists, which helped with performance but then it became a large waste of space as the grid cells match size (so when arguments section is only one or two it had the same height as the fields section that had say 20).

Hopefully what I've shared makes sense. Feel free to ask any questions about the layout. Overall I'd like to see squeezing more performance out and being able to keep up with the GTK version to some degree.

*Sorry for any color blind issues with the image. It was the best way I could figure out how to discuss what I'm working on.

[andydotxyz]

Embedding many containers is the right thing to do and does not, in itself, cause the performance issues (try it with no content!).

What is slow is resizing/wrapping all the text widgets.
List is good for performance as you guessed. If it collapses to 1 row then your parent container was not asking it to expand - this is not a fault of list but perhaps you packed it into the wrong container?

[kendellfab]

Thanks for the feedback. Would you have any suggestions for how to layout the two lists vertically? If there was a way to conserve space when the list wasn't full that would be helpful.

[andydotxyz]

I don't know what to suggest because I don't know what you have tried.
Widgets will fill the space by default - so some parent container in your code is causing it to shrink.

Looking at the amount of text lines (I could not see before, was on mobile) especially on the first text column a List will certainly be your friend. If the blue box was just List and on the left side of a Split container it will work perfectly. Slightly complicated by needing multiple splits - but my guess is you have a VBox packed in there somewhere that is not helping.