Reputation: 656
I’m having an issue with .Net Maui, particularly with navigation where it can be jittery and slow in performance when navigating to a view with a lot of information on, sometimes it can occur even when navigating to a page that only has a collection view with bindings that only load a couple of items.
I have tried with both shell navigation and basic navigation and still the same issue occurs of slow jittery navigation.
The fastest load is when there’s no bindings I have noticed. So is it better to not use bindings for performance? I’ve read the docs on using compiled bindings here Microsoft Docs and though it does boost performance it doesn’t fix the issue 100%.
Have tested this on all types of devices from old tablets and phones (6+ years old) to newer tablets and phones (2+ years old). While the newer ones do perform better, the issue is still there.
I’ve seen some suggestions around saying to improve performance you add a Task.Delay(500) to OnAppearing() so that the view can animate in before doing anything but if you were to look at other Android applications made outside of Maui then the pages load within half a second and don’t use this hack, why is Maui different in navigation performance or am I missing something? If anyone knows of a way to improve navigation loading performance let me know.
MonkeysView.xaml
<CollectionView ItemsSource="{Binding Monkeys}">
<CollectionView.ItemTemplate>
<DataTemplate>
<Grid Padding="10">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Image Grid.RowSpan="2"
Source="{Binding ImageUrl}"
Aspect="AspectFill"
HeightRequest="60"
WidthRequest="60" />
<Label Grid.Column="1"
Text="{Binding Name}"
FontAttributes="Bold" />
<Label Grid.Row="1"
Grid.Column="1"
Text="{Binding Location}"
FontAttributes="Italic"
VerticalOptions="End" />
</Grid>
</DataTemplate>
</CollectionView.ItemTemplate>
MonkeysView.xaml.cs
public ObservableCollection<MonkeyModel> Monkeys
public MonkeysView()
{
BindingContext = this;
}
pubic override void OnAppearing()
{
await FetchMonkeysAsync();
}
public async Task FetchMonkeysAsync()
{
// Simulate monkey fetch
// Lots of code here to fetch monkeys.
await Task.Delay(2500);
// ...
// ...
Monkeys = new ObservableCollection<MonkeyModel>(monkeysFromServer);
}
MonkeyModel.cs
public class MonkeyModel : ObservableObject
{
[ObservableProperty]
private string _name;
[ObservableProperty]
private string _location;
[ObservableProperty]
private string _imageUrl;
}
Navigate using:
Shell.Current.GoToAsync("MonkeysView");
Upvotes: 4
Views: 4148
Reputation: 36
This is how I manage slow navigation for complex pages.
After some testing I found that the last call to trigger before the new page is shown to the user is OnNavigatedTo
so I do this:
protected override async void OnNavigatedTo(NavigatedToEventArgs args)
{
base.OnNavigatedTo(args);
await Task.Delay(1);//Yield thread so the page is shown to the user
//This initial page should mostly just have a spinner
await VM?.UILoaded();//Load slow complex elements while the user watches the spinner
}
Upvotes: 1
Reputation: 29
The issue is an internal issue related to the speed at which MAUI renders complex pages. According to the title below, it is planned to be resolved with .Net 8 servicing or .Net 9 at the latest.
https://github.com/dotnet/maui/issues/14591
Upvotes: 0