dotnet / maui

.NET MAUI is the .NET Multi-platform App UI, a framework for building native device applications spanning mobile, tablet, and desktop.
https://dot.net/maui
MIT License
22k stars 1.72k forks source link

CollectionView in ios renders very slow when grouped. #23510

Open JPfahl opened 2 months ago

JPfahl commented 2 months ago

Description

In IOS when the collection view is configured for grouping, updating the data in the collection is very slow. In the sample provided here the time to reload the collection in Android averages 0.0004 seconds, Windows averages 0.002 seconds and IOS averages 0.1 seconds. With so little data that seems ok, but in comparison IOS is 50 times slower than Windows and 250 times slower than Android. I my actual app (not this simple example) that difference makes IOS unusably slow. Reloading 100 items takes 8 seconds and gets longer with every refresh.

Steps to Reproduce

Sample.zip

Link to public reproduction project repository

No response

Version with bug

8.0.61 SR6.1

Is this a regression from previous behavior?

Not sure, did not test other versions

Last version that worked well

Unknown/Other

Affected platforms

iOS

Affected platform versions

ios 17.2

Did you find any workaround?

No

Relevant log output

No response

github-actions[bot] commented 2 months ago

Hi I'm an AI powered bot that finds similar issues based off the issue title.

Please view the issues below to see if they solve your problem, and if the issue describes your problem please consider closing this one and thumbs upping the other issue to help us prioritize it. Thank you!

Open similar issues:

Closed similar issues:

Note: You can give me feedback by thumbs upping or thumbs downing this comment.

PureWeen commented 2 months ago

@JPfahl can you upload your repro to a github account please?

JPfahl commented 2 months ago

I included a page in the attached zip that demonstrates the issue. My project is far too large and not open source so I can't share it.

PureWeen commented 2 months ago

@JPfahl Can you upload that page to a github repository? We can't work with zip files for security reasons.

drasticactions commented 2 months ago

@JPfahl I took the security risk on behalf of @PureWeen and your problem is you are breaking Virtualization of the page.

スクリーンショット 2024-07-10 16 32 27

VerticalStackLayout and the contents in it don't have an intrinsic height (See this doc on changes between Forms and MAUI regarding StackLayout). Since your CollectionView is inside the VerticalStackLayout, and doesn't have a height, iOS/Catalyst is going to try and render the entire list and all of its contents. I believe that's also happening on Android too, but it, by happenstance is faster to render but it's going to use more memory when it doesn't need to.

A simple fix is to use a Grid instead. I changed your sample to use one. This loads thousands of items in your grouped list. Using your original code, it would take multiple seconds to load on iOS/Catalyst. With my change, it's instant.

https://github.com/drasticactions/MauiRepros/blob/main/GroupedTest/Sample.xaml

This does give CollectionView a height (Pinned to the bottom of the page) and that fixes Virtualization.

@PureWeen Does this sound correct?

JPfahl commented 2 months ago

I use a Grid for layout in my main application. I changed the sample I sent and it does not change the time used when the collection bound to the grid is changed causing a UI update. Sample.zip

kevinxufei commented 2 months ago

This issue has been verified using Visual Studio 17.11.0 Preview 3.0(8.0.70 & 8.0.61). Can repro it. And using Grid for layout can reduces time.

https://github.com/drasticactions/MauiRepros/blob/main/GroupedTest/Sample.xaml

JPfahl commented 3 weeks ago

This is a critical issue for our application, the collectionview update is so slow it is unusable on ios. What is the timeline for this to be addressed?