maui: CollectionView slow/jittering scroll

Description

When there is a complex layout Scroll does not work efficiently.

Steps to Reproduce

I have this layout, as you can see I have used the recommended bindings OneTime and CompressedLayout.IsHeadless="True".

ItemSizingStrategy has to be in mode: MeasureAllItems. Each element can have a different height.

There are like 30-40 elements, the Scroll is unacceptable, both in debug/release mode. Thus, the application cannot be released to production.

I don’t know if I can improve my design, but i can’t get it. Any help is welcome.

Link to public reproduction project repository

https://github.com/angelru/CvSlowJittering

Version with bug

7.0 (current)

Last version that worked well

Unknown/Other

Affected platforms

Android

Affected platform versions

Android 12

Did you find any workaround?

No response

Relevant log output

No response

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Reactions: 11
  • Comments: 49 (24 by maintainers)

Commits related to this issue

Most upvoted comments

I believe we have enough changes to close this one, testing the above sample with my script here:

https://github.com/jonathanpeppers/maui-scrolling-performance

.NET 7:

05-09 09:11:49.830 16727 16727 I DOTNET  : Frame(s) that took ~5ms, count: 5
05-09 09:11:49.831 16727 16727 I DOTNET  : Frame(s) that took ~6ms, count: 24
05-09 09:11:49.831 16727 16727 I DOTNET  : Frame(s) that took ~7ms, count: 5
05-09 09:11:49.831 16727 16727 I DOTNET  : Frame(s) that took ~8ms, count: 37
05-09 09:11:49.831 16727 16727 I DOTNET  : Frame(s) that took ~9ms, count: 29
05-09 09:11:49.831 16727 16727 I DOTNET  : Frame(s) that took ~10ms, count: 2
05-09 09:11:49.831 16727 16727 I DOTNET  : Frame(s) that took ~11ms, count: 2
05-09 09:11:49.831 16727 16727 I DOTNET  : Frame(s) that took ~12ms, count: 3
05-09 09:11:49.831 16727 16727 I DOTNET  : Frame(s) that took ~14ms, count: 1
05-09 09:11:49.832 16727 16727 I DOTNET  : Frame(s) that took ~19ms, count: 2
05-09 09:11:49.832 16727 16727 I DOTNET  : Frame(s) that took ~21ms, count: 2
05-09 09:11:49.832 16727 16727 I DOTNET  : Average frame time: 8.33ms
05-09 09:11:49.832 16727 16727 I DOTNET  : No. of slow frames: 4

.NET 8 net8.0 branch + main on top:

05-09 09:15:10.010 17241 17241 I DOTNET  : Frame(s) that took ~4ms, count: 1
05-09 09:15:10.011 17241 17241 I DOTNET  : Frame(s) that took ~5ms, count: 8
05-09 09:15:10.011 17241 17241 I DOTNET  : Frame(s) that took ~6ms, count: 31
05-09 09:15:10.011 17241 17241 I DOTNET  : Frame(s) that took ~7ms, count: 3
05-09 09:15:10.011 17241 17241 I DOTNET  : Frame(s) that took ~8ms, count: 12
05-09 09:15:10.011 17241 17241 I DOTNET  : Frame(s) that took ~9ms, count: 2
05-09 09:15:10.011 17241 17241 I DOTNET  : Frame(s) that took ~10ms, count: 3
05-09 09:15:10.011 17241 17241 I DOTNET  : Frame(s) that took ~11ms, count: 3
05-09 09:15:10.011 17241 17241 I DOTNET  : Frame(s) that took ~12ms, count: 1
05-09 09:15:10.011 17241 17241 I DOTNET  : Frame(s) that took ~15ms, count: 2
05-09 09:15:10.011 17241 17241 I DOTNET  : Frame(s) that took ~18ms, count: 1
05-09 09:15:10.011 17241 17241 I DOTNET  : Average frame time: 7.28ms
05-09 09:15:10.011 17241 17241 I DOTNET  : No. of slow frames: 1

Scrolling feels a lot better. I tested these on a Pixel 5 (released in Oct 2020).

The list of performance changes, I think led to the improvement here:

The recent fixes for memory leaks, likely also helped.

We can always make this even better, but I think this is enough to close this one for now. Thanks!

What do I do if my app still scrolls slowly?

First, try it on the latest .NET 8 release and see if things have improved.

If not, file a new issue with a sample app, and we can profile the app and see what we find. You can also try the instructions at https://aka.ms/profile-maui to profile it yourself.

The memory leak here may have been fixed by: https://github.com/dotnet/maui/pull/13656

No idea about the performance of it, though.

Need to retest this issue, but I’ve been working on this all week instead: https://github.com/dotnet/maui/pull/13833

Fixing a performance issue with {AppThemeBinding} (https://github.com/dotnet/maui/pull/14625) a decent start to help this one.

The next thing that stuck out to me here is something we can fix in Java interop:

653.69ms (6.3%) mono.android!Android.Widget.TextView.set_Text(string)
198.05ms (1.9%) mono.android!Java.Lang.String..ctor(string)
121.57ms (1.2%) mono.android!Java.Lang.Object.Dispose()

It looks like we can improve all string properties in: https://github.com/xamarin/java.interop/pull/1101

Following https://aka.ms/profile-maui, I profiled this sample on Android:

https://github.com/angelru/CvSlowJittering

One thing odd is how much time is spent in:

image

Looking at the stacktrace, all this time is spent doing things with {AppThemeBinding}:

image

This code seems like it runs on all platforms, so maybe there is a general win here.

If we could avoid 100s (1000s?) of nested views all subscribing to this event through WeakEventManager – that uses System.Reflection underneath.

In a future Visual Studio preview, there will be a .NET 8 Preview optional checkbox. And you can just change your project to net8.0 to try it.

In a more distant future, you’ll be able to change <MauiVersion> to try new versions (even in different projects), but the groundwork for this is only in .NET 8+.

This PR also helps this issue: https://github.com/dotnet/maui/pull/14701

The MapTextColor method used to call TextView.Text (with the same text!):

image

I will profile this app again w/ .NET 8 after all the current changes are there.

This recent change would have some decent impact for scrolling performance on Android: 160e721c05c9ddf795cb7947182a333968862734

Let me retest this one again with latest dotnet/maui/main. I did not get to the point of looking at BindableLayout performance yet.

@jsuarezruiz I already put the repository in the problem description https://github.com/angelru/CvSlowJittering

@angelru Yes, I tested on Samsung Galaxy Tab Active 2 - Android 9. The collection View scroll is laggy, very very slow @jsuarezruiz

@mohachouch With my provided example, were you able to see the lag?

Have you tried changing to a ListView? also try this Sharpnado.CollectionView

@angelru Can you try with the same item height if the scroll is smooth

the same issue