When to load data

[FM1973]

Hey there.

Can someone explain to me when to load data in a viewmodel to avoid a stuttering navigation animation?

I navigate to a page using:
await Shell.Current.GoToAsync($"//{nameof(xxxxx)}", true);

In my page I override the "OnAppearing" event.
protected override async void OnAppearing() { base.OnAppearing(); await ViewModel.InitializeAsync(this); }

The InitializeAsync method in my viewModel looks like this...
public override async Task InitializeAsync(object sender) { IsBusy = false; HasError = false; ErrorMessage = string.Empty; IsBusy = true; await LoadAsync(); IsBusy = false; }

The "LoadAsync" method loads data from a rest service and binds the result to i.e. an obserableCollection.

Using this code, there is some sort of "stuttering" when navigating to the page.

When I add await Task.Delay(500); before calling "LoadAsync" the stuttering goes away. The delay depends on the number of data being loaded. Can be 500, 250 or something else.

Is there a better way without using Task.Delay?

Thanks a lot for your help!

[Artyfice]

I'm facing the exact same problem. Did you find a solution since?

[FM1973]

@Artyfice not really. Still struggling with this problem.

[mphill]

Can you run LoadAsync in Task.Run() and not await, just make sure you do the updates on the main UI thread. Just a word of caution, using Shell.Current.GoToAsync is super awkward with string routes for passing data. From time to time you will want to pass in objects which might solve this issue in this case. I find pushing the page works better personally.

[FM1973]

@mphill
Thanks, using Task.Run(LoadAsync); works a lot better. I still have to use the delay as well, because inside my LoadAsync Method I´m setting the values for some Observable-Properties, but the stuttering has almost gone away.

[Mashedpoturtles]

Im having this issue, have you managed to fix it?

[FM1973]

No perfect solution yet, sorry. But using Task.Run(LoadAsync) is much better.

[romainnovi]

Hello everyone. In my case using Shell.Current.Dispatcher.DispatchAsync fixed the problem. The methods of the MainThread class had no positive results https://github.com/dotnet/maui/discussions/7518#discussioncomment-2857071
If it helps :)

[roubachof]

Hi there!
I created TaskLoaderView for this exact issue people ALWAYS face cause they are not addressed by the mvvm architecture.
https://github.com/roubachof/Sharpnado.TaskLoaderView

[Xyncgas]

As long you can manually ask for UI re-render nothing is trouble, the selling point imo of MVVM frameworks is automatically updating the UI for you once your model data has changed, but if you are comfortable updating UI manually it doesn't really matter how you do it

[MJSanfelippo]

Did anyone find a good solution for this that isn't Task.Delay that makes the navigation not stutter? I tried all combinations of Task.Run, Dispatcher.DispatchAsync etc. and the only thing that reliably works is Task.Delay, which kinda sucks because I'd like to start loading the data from the viewmodel immediately when it is instantiated/appearing, instead of waiting for some arbitrary delay.

[Xyncgas]

Load the data whenever you want but asynchronously, once you have the data trigger re-rendering. Usually re-render happens automatically via data binding but you can trigger it manually. So for example you should display a loading page or simply empty grid initially but after loading data you get stuffs displayed

Executing the loading asynchronously afaik shouldn't cause UI lag, and if you are triggering re-rendering after finished data loading, use marshaling (as required by .NET products mostly) to update the UI by calling a special function in the control but I forgot which

[CodingOctocat]

I tend to use either the Loaded event or the NavigatedTo event to load data. However, chatGPT seems to recommend the OnAppearing event because it is usually faster.

Reference Article. Understanding .NET MAUI Page and Navigation Lifecycle Event Order

[jmichas]

I think everyone commenting on this or those unsure what/when/how to do this should take a look at this talk.
https://www.youtube.com/watch?v=GQYd6MWKiLI
It will most likely clear up a lot of confusion about async/await and why the UI thread is being blocked or stuttering. The ideas people have around Task.Run are problematic and this talk will explain why. You can hopefully avoid deadlocks or swallowed exceptions so your code runs better and is easier to debug.

[timdinh-grex]

Try await LoadAsync().ConfigureAwait(false) to avoid context switching. Also if you have a loop in LoadAsync method, try add await Task.Yield().ConfigureAwait(false) so that it doesn't hog CPU

[CodingOctocat]

Try await LoadAsync(). ConfigureAwait(false) to avoid context switching. Also if you have a loop in LoadAsync method, try add await Task.Yield(). ConfigureAwait(false) so that it doesn't hog CPU

Could you give a simple example? I don't quite understand where Task.Yield() should be added, also Task.Yield() needs ConfigureAwait(false)?

[Xyncgas]

The ideas people have around Task.Run

It's Task.Run that's problematic
The communication is not clear why is there a public api we are allowed to use that can be bad to use it

If Task.API is single threaded asynchronous api it wouldn't be so problematic, people could've run all tasks in threads if they wanted, but the library is designed badly to be used in C# with async await keywords so parallelism is mixed in the use scenarios and is not handled elegantly

I'm saying something wrong so
please correct