Best way to deal with IObservable values

[giard-alexandre]

Hi! This is less of an "issue" and more of a "What is the recommended way of doing x" thing...

Preface

I currently have an app that uses TreeDataGrid to display data. The project and data is setup as follows:

• Project is Avalonia Desktop app with RxUI as the "framework"
• In this specific component: a DynamicData Iobservable<IChangeSet> is bound to a ReadonlyObservableCollection.
• The ReadonlyObservableCollection is supplied as the source list for FlatTreeDataGridSource.
• The items in the collection have Observable properties that I bind at creation time and those props are being updated every 500ms (plus or minus)
• The rows of the treedatagrid itself don't change often but those properties on every row DO need to be updated often and quickly.

Problem

I tried exposing the properties as IObservables and just binding to the observables themselves in the axaml file, using the ^ stream binding operator. The values populate properly and update as expected when the view is static. Unfortunately, when a user starts to scroll, we encounter 2 issues:

1. The scrolling is very janky and hitches as the user scrolls down and we can see that the layout time (from avalonia devtools window) spikes up significantly (I'm talking 250+ ms)
2. The columns that bind to properties that are observables are intially empty and a split second later they pop in, making the experience even more "janky"

I tried adding a .Replay(1) to my observables to see if it would help with the pop-in and it did not.

Since I have another TreeDataGrid in the app that has static data once bound (almost static) and that THAT TreeDataGrid performs extremely well even when scrolling through over 30k items, I figured the observables might be the issue.

In an effort to remedy that, I bound each of the observables to an ObservableAsPropertyHelper property. More info here and, since I use ToPropertyEx, here.

This actually did help some but only for the pop-in issues. The props are now already populated when the row scrolls into view but the scrolling still hitches SIGNIFICANTLY, even though I might have less than 100 rows in the grid.

Rather than try 15 different combinations of methods to try to fix this, I thought I'd reach out and pick the brains of the people who built the Grid to see what you think is the best solution!

Thanks in advance for the help!