ListView with Label.FormattedText in DataTemplate causes performance issues

[eclipsed4utoo]

Description

I am currently working on an Instagram type app where there is a "feed" that contains posts of an image and some text. In that text, there could be user mentions or hashtags. I needed to show those in blue, so I used FormattedString and Spans, and using the FormattedText property on the label. However, when the list is loaded, scrolling performance is degraded.

However, the scrolling performance issues go away when I switch to using the Text property on the label, the scrolling performance issues went away, but I also lose my highlighting.

I would like to know if I am doing something wrong. I originally thought the issue was the images(which are typically the issue), but once I started playing with the text, I noticed that the text was the cause of the scrolling issues.

Steps to Reproduce

1. Run sample app below
2. Scroll up and down
3. Notice scrolling performance issues.
4. Stop app, go to MainPage.xaml, in the DataTemplate for the list view, comment out the label using FormattedText and uncomment out the label using Text.
5. Run app again
6. Notice that there aren't any scrolling performance issues.

Expected Behavior

Scrolling performance shouldn't be changed when using FormattedText vs. Text with a Label.

Actual Behavior

Performance is changed significantly.

Basic Information

• Version with issue: XF 3.4.0.1029999
• Last known good version: N/A
• IDE: VS for Mac
• Platform Target Frameworks:
  • iOS: 12.1
• Nuget Packages:
  • FreshMvvm
  • Newtonsoft.Json
  • PropertyChanged.Fody
  • Xamarin.Essentials
  • Xamarin.FFImageLoading.Forms
  • Xamarin.FFImageLoading.Transformations
• Affected Devices:
  • iPhone 6 - 11.2.1

Reproduction Link

ListViewTest.zip

[AndreiMisiukevich]

https://github.com/xamarin/Xamarin.Forms/issues/3335 the same issue (?)

[eclipsed4utoo]

@AndreiMisiukevich #3335 specifically references Android. My issue is happening on iOS, so I'm unsure if it's the same issue or not.

Also, from #3335..

Application Output is filled with messages like the one above. The scroll's behavior doesn't seem to be impacted when the debugger is not connected.

My Application Output does not have the messages, and the terrible scrolling behavior even occurs in Release builds for me.

So it would seem that the 2 issues are different.(at least on the surface, they seem to be)

[kingces95]

Hm, this is going to be a challenge to debug. On my iPhone the scrolling looks ok.

[kingces95]

https://youtu.be/_sYPRG23dXo

[eclipsed4utoo]

@kingces95, yes, newer phones seem to work fine, probably because of the performance increase over an iPhone 6.

[acidbless]

I have the same issue on Android. There is one interesting point how to reproduce it. If I quickly scroll through the list (fling) the problem does not appear, but if I swipe, the list will scroll with significant lags. In my application I use a DataTemplateSelector to select the type of cells to display and lags occur in those places where I touch and swipe cells containing FormattedString, and disappear if the cells become invisible.

p.s. Debug output contains an infinite number of the following messages: 02-21 17: 10: 25.608 W / View (24866): requestLayout () is improperly called by md51558244f76c53b6aeda52c8a337f2c37.FormsTextView {c8b83a2 V.ED ..... ...... ID 0.0-794,273 #aa} during layout: running second layout pass

[acidbless]

Looks like #3168 is related issue.

[eclipsed4utoo]

@kingces95 Actually, you do have the issue. As your first swipe is starting to end, right at 2 seconds into the video, you can see that the post "jumps". That's the performance issue.

You can also see the issue with your third swipe, when the post jumps again.

[adrianknight89]

I'm seeing this same issue on iOS as well.

[chrisfoulds]

this is a real performance killer in my applications any idea of timeframe ?

[adrianknight89]

One suggestion is creating a formatted string cache so that we don't have to re-build each attributed text over and over. OneTime binding doesn't seem to help much here.

[jonathanantoine]

Any other idea :D ?

[adrianknight89]

@jonathanantoine I haven't tried this, but recently HTML formatted text was added to Label. Update your Nuget package and see if you can leverage that. Also, once CollectionView is ready, performance should be somewhat better.

[LeoJHarris]

Where a label has FormattedString and LineBreakMode="TailTruncation" in listview DataTemplate is causing the nursery to become full and causing the page to become completely unresponsive until I have to close the whole app, after I removed the LineBreakMode="TailTruncation" the app worked again. Anyone else notice the same?

GC_MINOR: (Nursery full) time 24.41ms, stw 25.18ms promoted 484K major size: 3056K in use: 2258K los size: 2048K in use: 1461K

[RedasP]

Same issue in Android. The performance hit was noticable in 3.6.0.344457, but it became unacceptable in 4.4.0.991477.

We've used FormattedText to concat two DateTimes with a hyphen in the middle. The solution was to do the concatenation in ViewModel instead of View and to get rid of FormattedText.

[chrisfoulds]

We gave up and rewrote every page of XAML that used formatted text to not use it as the performance was below what a customer would accept.

[chrisfoulds]

What annoys me is they keep adding new features but have yet to fix the basics.

[LeoJHarris]

@chrisfoulds Completely agree, these kinds of issues need to be addressed first. I understand the Xamarin team have alot of work to prioritize but @samhouts can we please get the essentials working prior to adding new shiny features.

Every time a new feature gets added theres always a handful of new tickets that open on them and things like these get left way behind.

This was a actually a pretty hard to spot issue and will probably catch alot of devs by surprise.

[samhouts]

We created CollectionView (yes, a shiny new control, don't be mad at me 😂) with the hope of resolving performance issues with ListView. It's using more performant native controls, and it has fewer layers of abstraction. Would you be willing to convert your ListView to a CollectionView to see if this issue is resolved there? Thanks!

[LeoJHarris]

@samhouts when we get the chance we will check on CollectionView, we had partially migrated to CollectionView in some of our projects but had to roll back some due to bugginess/issues on iOS that was unacceptable for production. Some tickets I had raised and other devs, we just need to find some time to go back and update and check if those issues have been resolved.

As far as android is concerned we have been very impressed with collectionview over listview, much more performant and flexible so we look forward to fully migrating hopefully not too far away 👍

[haavamoa]

The same issues still happens when using CollectionView @samhouts .

[GiampaoloGabba]

Wow i just had this problem with xf 4.8 and collectionview. I used Spans to decrease the views inside my datatemplate aiming for Max performance and optimization. The result is orrible in mid Android phones, the scrolling is very, very bad. Finally i found this issue, so i rewrote everything using labels and now is much better.

[giuseppenovielli]

Hi, as a workaround, can create a Label CustomRenderer and assign iOS -> Control.AttributedText Android -> Control.SetText(use SpannableString)

So write Native Spans, i think performance are better.

[huyvuskedulo]

I'm having the same issue .... and using the latest Xamarin forms version. It's sad that they didn't fix such a basic feature like this for years