Slow `ModalPage` rendering if a `CollectionView` or `ListView` is used

[AndreasReitberger]

Description

I'm using a modal page to display item data. The page takes about 3 seconds to show, even if there is no heavy dataloading.
As far as I see, Windows is working fine (mostly due to more CPU power). Seeing the issue on iOS and Android.

So I created a small test case setup, once just using Shell.Current, once using a helper class I made to simplify navigations. Time is mostly the same. All relevant code happens in the AppViewModel

So I made some further tests, this is what I figured out so far.

1. If the CollectionView only uses simple data => ObservableCollection<string>, the rendering is fast

2. If using a CollectionView with complex data => ObservableCollection<Item>, the rendering is slow

public partial class Item : ObservableObject
{
    #region Properties
    [ObservableProperty]
    string name;

    [ObservableProperty]
    DateTimeOffset start = DateTimeOffset.Now;

    [ObservableProperty]
    DateTimeOffset end = DateTimeOffset.Now.Add(TimeSpan.FromHours(2));
    #endregion
}

This is the log on slow rendering navigations

[ProfileInstaller] Installing profile for com.companyname.shellnavtests
[EGL_emulation] app_time_stats: avg=430.41ms min=1.44ms max=5110.89ms count=12
Thread started:  #12
[e.shellnavtests] Explicit concurrent copying GC freed 7510(680KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 4325KB/8651KB, paused 365us,59us total 9.984ms
[0:] Microsoft.Maui.Controls.BindableObject: Warning: Cannot convert Microsoft.Maui.Controls.Style to type 'Microsoft.Maui.Controls.Shadow'
[0:] ViewItemModalPageViewModel.OnAppearing: Done in 00:00:00.0047411
[OnBackInvokedCallback] OnBackInvokedCallback is not enabled for the application.
[OnBackInvokedCallback] Set 'android:enableOnBackInvokedCallback="true"' in the application manifest.
[0:] Performance: Start => AppViewModel.NavigateTo: 10/31/2023 8:36:52 AM)
[0:] Performance: Start => ViewItemModalPageViewModel.OnAppearing: 10/31/2023 8:36:52 AM)
[0:] Performance: Done => ViewItemModalPageViewModel.OnAppearing: 10/31/2023 8:36:52 AM (Duration: 00:00:00.0026347)
[MaterialButton] MaterialButton manages its own background to control elevation, shape, color and states. Consider using backgroundTint, shapeAppearance and other attributes where available. A custom background will ignore these attributes and you should consider handling interaction states such as pressed, focused and disabled
[MaterialButton] MaterialButton manages its own background to control elevation, shape, color and states. Consider using backgroundTint, shapeAppearance and other attributes where available. A custom background will ignore these attributes and you should consider handling interaction states such as pressed, focused and disabled
[0:] ViewItemModalPageViewModel.Pages_Loaded: Done in 00:00:00.0045410
[e.shellnavtests] Explicit concurrent copying GC freed 3075(202KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 4943KB/9886KB, paused 383us,64us total 8.323ms
[e.shellnavtests] Explicit concurrent copying GC freed 2398(144KB) AllocSpace objects, 1(240KB) LOS objects, 49% free, 5899KB/11MB, paused 377us,60us total 8.154ms
[e.shellnavtests] Compiler allocated 4160KB to compile void android.widget.TextView.<init>(android.content.Context, android.util.AttributeSet, int, int)
The thread 0xc has exited with code 0 (0x0).
Thread finished:  #12
[e.shellnavtests] Explicit concurrent copying GC freed 2570(127KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 5931KB/11MB, paused 371us,60us total 8.308ms
[e.shellnavtests] Explicit concurrent copying GC freed 3194(149KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 5957KB/11MB, paused 377us,61us total 7.970ms
[e.shellnavtests] Explicit concurrent copying GC freed 2070(97KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 5972KB/11MB, paused 457us,60us total 8.095ms
[e.shellnavtests] Explicit concurrent copying GC freed 2543(126KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 6005KB/11MB, paused 497us,59us total 7.856ms
[e.shellnavtests] Explicit concurrent copying GC freed 2393(121KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 6028KB/11MB, paused 371us,60us total 8.241ms
[0:] Performance: Start => ViewItemModalPageViewModel.Pages_Loaded: 10/31/2023 8:36:53 AM)
[0:] Performance: Start => ViewItemModalPageViewModel.OnLoadedAsync: 10/31/2023 8:36:53 AM)
[0:] Performance: Done => ViewItemModalPageViewModel.Pages_Loaded: 10/31/2023 8:36:53 AM (Duration: 00:00:00.0042800)
[EGL_emulation] app_time_stats: avg=1382.29ms min=357.87ms max=2406.70ms count=2
[0:] AppViewModel.NavigateTo: Done in 00:00:02.7717247
[OpenGLRenderer] Davey! duration=2419ms; Flags=0, FrameTimelineVsyncId=149564, IntendedVsync=12878692267382, Vsync=12878858934042, InputEventId=0, HandleInputStart=12878859182500, AnimationStart=12878859207100, PerformTraversalsStart=12878859283700, DrawStart=12881025932700, FrameDeadline=12878725600714, FrameInterval=12878859148300, FrameStartTime=16666666, SyncQueued=12881078738400, SyncStart=12881078915500, IssueDrawCommandsStart=12881079086900, SwapBuffers=12881111125600, FrameCompleted=12881112010800, DequeueBufferDuration=25000, QueueBufferDuration=479500, GpuCompleted=12881111823500, SwapBuffersCompleted=12881112010800, DisplayPresentTime=98784247816, CommandSubmissionCompleted=12881111125600, 
[0:] Performance: Done => AppViewModel.NavigateTo: 10/31/2023 8:36:55 AM (Duration: 00:00:02.7714598)
[EGL_emulation] app_time_stats: avg=439.16ms min=22.23ms max=1641.03ms count=4
[OnBackInvokedCallback] OnBackInvokedCallback is not enabled for the application.
[OnBackInvokedCallback] Set 'android:enableOnBackInvokedCallback="true"' in the application manifest.
[EGL_emulation] app_time_stats: avg=96.56ms min=1.67ms max=1225.40ms count=14
[e.shellnavtests] Compiler allocated 4533KB to compile void android.view.ViewRootImpl.performTraversals()

Result:

@jonathanpeppers
Maybe you have some thought about this?
Thank you!

Steps to Reproduce

1. Use the provided repro
2. Run the application on Android
3. Compare the times between simple and complex data

Link to public reproduction project repository

https://github.com/AndreasReitberger/MauiNavigationTests

Version with bug

8.0.0-rc.2.9373

Is this a regression from previous behavior?

Yes, this used to work in Xamarin.Forms

Last version that worked well

Unknown/Other

Affected platforms

iOS, Android

Affected platform versions

No response

Did you find any workaround?

No response

Relevant log output

With simple data:

[EGL_emulation] app_time_stats: avg=212.87ms min=2.01ms max=3396.73ms count=17
[0:] Microsoft.Maui.Controls.BindableObject: Warning: Cannot convert Microsoft.Maui.Controls.Style to type 'Microsoft.Maui.Controls.Shadow'
[e.shellnavtests] Explicit concurrent copying GC freed 5105(433KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 4808KB/9617KB, paused 369us,58us total 9.712ms
[0:] ViewItemModalPageViewModel.OnAppearing: Done in 00:00:00.0007059
[OnBackInvokedCallback] OnBackInvokedCallback is not enabled for the application.
[OnBackInvokedCallback] Set 'android:enableOnBackInvokedCallback="true"' in the application manifest.
[0:] Performance: Start => AppViewModel.NavigateTo: 10/31/2023 8:28:09 AM)
[0:] Performance: Start => ViewItemModalPageViewModel.OnAppearing: 10/31/2023 8:28:09 AM)
Thread started: <Thread Pool> #29
[0:] Performance: Done => ViewItemModalPageViewModel.OnAppearing: 10/31/2023 8:28:09 AM (Duration: 00:00:00.0005398)
[MaterialButton] MaterialButton manages its own background to control elevation, shape, color and states. Consider using backgroundTint, shapeAppearance and other attributes where available. A custom background will ignore these attributes and you should consider handling interaction states such as pressed, focused and disabled
[MaterialButton] MaterialButton manages its own background to control elevation, shape, color and states. Consider using backgroundTint, shapeAppearance and other attributes where available. A custom background will ignore these attributes and you should consider handling interaction states such as pressed, focused and disabled
[0:] ViewItemModalPageViewModel.Pages_Loaded: Done in 00:00:00.0006728
Thread started: <Thread Pool> #30
Thread started: <Thread Pool> #31
[e.shellnavtests] Explicit concurrent copying GC freed 3299(225KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 4903KB/9806KB, paused 375us,61us total 9.674ms
[e.shellnavtests] Explicit concurrent copying GC freed 1528(84KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 4915KB/9830KB, paused 375us,263us total 9.586ms
[0:] Performance: Start => ViewItemModalPageViewModel.Pages_Loaded: 10/31/2023 8:28:09 AM)
[0:] Performance: Done => ViewItemModalPageViewModel.Pages_Loaded: 10/31/2023 8:28:09 AM (Duration: 00:00:00.0003735)
[0:] Performance: Start => ViewItemModalPageViewModel.OnLoadedAsync: 10/31/2023 8:28:09 AM)
Thread started: <Thread Pool> #32
Thread started: <Thread Pool> #33
[0:] AppViewModel.NavigateTo: Done in 00:00:00.9269064
[0:] Performance: Done => AppViewModel.NavigateTo: 10/31/2023 8:28:09 AM (Duration: 00:00:00.9266877)


With complex:
[ProfileInstaller] Installing profile for com.companyname.shellnavtests
[EGL_emulation] app_time_stats: avg=430.41ms min=1.44ms max=5110.89ms count=12
Thread started:  #12
[e.shellnavtests] Explicit concurrent copying GC freed 7510(680KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 4325KB/8651KB, paused 365us,59us total 9.984ms
[0:] Microsoft.Maui.Controls.BindableObject: Warning: Cannot convert Microsoft.Maui.Controls.Style to type 'Microsoft.Maui.Controls.Shadow'
[0:] ViewItemModalPageViewModel.OnAppearing: Done in 00:00:00.0047411
[OnBackInvokedCallback] OnBackInvokedCallback is not enabled for the application.
[OnBackInvokedCallback] Set 'android:enableOnBackInvokedCallback="true"' in the application manifest.
[0:] Performance: Start => AppViewModel.NavigateTo: 10/31/2023 8:36:52 AM)
[0:] Performance: Start => ViewItemModalPageViewModel.OnAppearing: 10/31/2023 8:36:52 AM)
[0:] Performance: Done => ViewItemModalPageViewModel.OnAppearing: 10/31/2023 8:36:52 AM (Duration: 00:00:00.0026347)
[MaterialButton] MaterialButton manages its own background to control elevation, shape, color and states. Consider using backgroundTint, shapeAppearance and other attributes where available. A custom background will ignore these attributes and you should consider handling interaction states such as pressed, focused and disabled
[MaterialButton] MaterialButton manages its own background to control elevation, shape, color and states. Consider using backgroundTint, shapeAppearance and other attributes where available. A custom background will ignore these attributes and you should consider handling interaction states such as pressed, focused and disabled
[0:] ViewItemModalPageViewModel.Pages_Loaded: Done in 00:00:00.0045410
[e.shellnavtests] Explicit concurrent copying GC freed 3075(202KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 4943KB/9886KB, paused 383us,64us total 8.323ms
[e.shellnavtests] Explicit concurrent copying GC freed 2398(144KB) AllocSpace objects, 1(240KB) LOS objects, 49% free, 5899KB/11MB, paused 377us,60us total 8.154ms
[e.shellnavtests] Compiler allocated 4160KB to compile void android.widget.TextView.<init>(android.content.Context, android.util.AttributeSet, int, int)
The thread 0xc has exited with code 0 (0x0).
Thread finished:  #12
[e.shellnavtests] Explicit concurrent copying GC freed 2570(127KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 5931KB/11MB, paused 371us,60us total 8.308ms
[e.shellnavtests] Explicit concurrent copying GC freed 3194(149KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 5957KB/11MB, paused 377us,61us total 7.970ms
[e.shellnavtests] Explicit concurrent copying GC freed 2070(97KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 5972KB/11MB, paused 457us,60us total 8.095ms
[e.shellnavtests] Explicit concurrent copying GC freed 2543(126KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 6005KB/11MB, paused 497us,59us total 7.856ms
[e.shellnavtests] Explicit concurrent copying GC freed 2393(121KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 6028KB/11MB, paused 371us,60us total 8.241ms
[0:] Performance: Start => ViewItemModalPageViewModel.Pages_Loaded: 10/31/2023 8:36:53 AM)
[0:] Performance: Start => ViewItemModalPageViewModel.OnLoadedAsync: 10/31/2023 8:36:53 AM)
[0:] Performance: Done => ViewItemModalPageViewModel.Pages_Loaded: 10/31/2023 8:36:53 AM (Duration: 00:00:00.0042800)
[EGL_emulation] app_time_stats: avg=1382.29ms min=357.87ms max=2406.70ms count=2
[0:] AppViewModel.NavigateTo: Done in 00:00:02.7717247
[OpenGLRenderer] Davey! duration=2419ms; Flags=0, FrameTimelineVsyncId=149564, IntendedVsync=12878692267382, Vsync=12878858934042, InputEventId=0, HandleInputStart=12878859182500, AnimationStart=12878859207100, PerformTraversalsStart=12878859283700, DrawStart=12881025932700, FrameDeadline=12878725600714, FrameInterval=12878859148300, FrameStartTime=16666666, SyncQueued=12881078738400, SyncStart=12881078915500, IssueDrawCommandsStart=12881079086900, SwapBuffers=12881111125600, FrameCompleted=12881112010800, DequeueBufferDuration=25000, QueueBufferDuration=479500, GpuCompleted=12881111823500, SwapBuffersCompleted=12881112010800, DisplayPresentTime=98784247816, CommandSubmissionCompleted=12881111125600, 
[0:] Performance: Done => AppViewModel.NavigateTo: 10/31/2023 8:36:55 AM (Duration: 00:00:02.7714598)
[EGL_emulation] app_time_stats: avg=439.16ms min=22.23ms max=1641.03ms count=4
[OnBackInvokedCallback] OnBackInvokedCallback is not enabled for the application.
[OnBackInvokedCallback] Set 'android:enableOnBackInvokedCallback="true"' in the application manifest.
[EGL_emulation] app_time_stats: avg=96.56ms min=1.67ms max=1225.40ms count=14
[e.shellnavtests] Compiler allocated 4533KB to compile void android.view.ViewRootImpl.performTraversals()

[tjiakwokyung28]

yes this is correct

[jonathanpeppers]

Were these tests and timings using a Release build? I would recommend retesting in Release mode if not.

Why is this considered a regression? The time the same code took in .NET 7 is not mentioned.

[AndreasReitberger]

@jonathanpeppers
It was a debug build. I did test it in net7, same slow loading.

I rebuilt it in Xamarin.Forms then, there it's extremely fast, in debug and release.
Hope this helps.

[jonathanpeppers]

Ok, so this didn't get worse going from .NET 7 to .NET 8?

[AndreasReitberger]

No, using my test project there was no different between net7 and net8, but with Xamarin.Forms.