Slow scrolling using complex DataTemplate with SfListView

Question

I'm using SfListView (v23.1.38) and seeing and slow scrolling down and up. Is there a way to improve the performance of the SfListView?Currently, I'm using DataTemplates:

RiyasHameed MohamedAbdulKhader · Accepted Answer

Junior Saravia,We have checked the
reported query again and we would like to inform you that when using a complex
layout or a DataTemplateSelector with more elements. since SfListView is a
virtualized control, a new template will be created for each item that enters
the view during scrolling when using a DataTemplateSelector. Therefore, you may
encounter frequent template creation, resulting in scrolling performance
issues. As a workaround, we recommend placing the SfListView inside a
ScrollView and setting “SfListView.IsScrollingEnabled” to false. This
will disable the SfListView's own scrolling functionality, potentially
improving the overall scrolling performance.

RiyasHameed MohamedAbdulKhader · Answer

Hi Junior Saravia,We have checked the
reported query and ran the provided sample, and we did not encounter any delay
in scrolling. We have attached a video for your reference. Additionally, we
have included a User Guide link below to help you improve ListView performance.User Guide Link - https://help.syncfusion.com/maui/listview/working-with-sflistview#improving-listview-performancePlease follow the guidelines provided in the
User Guide and confirm whether the issue still persists. If the issue continues
to persist, could you please share the details of your device with us?.Attachment: ScrollingDemo_28e7bf29.zip

Junior Saravia · Answer

Hi RiyasHameed,I see slow scrolling. Possible because I need to use Converters to modify the UI while scrollingIt's more visible on Samsung A11(I think because it's an old phone) and a bit slower on Samsung A53.I'm attaching some video records and an updated projectAttachment: Slow_scrolling_38a5edc0.zip

Suthi Yuvaraj · Answer

Hi Junior Saravia,We checked the issue at our end, we are unable to reproduce the issue at our end, We have tested the sample in Android emulators(Android 13, 11 and 9 ) and Physical device of Android 9 but we are unable to reproduce the issue at our end. As of now we didnot have mentioned device to test the reported scenario we are in need of two or more business days to test the scenario and find the appropriate solution . We will update you with further details on or before October 5, 2023 , We will appreciate your patience until then.Regards,Suthi Yuvaraj

Junior Saravia · Answer

Hi 
Suthi,Any updates about this issue

Junior Saravia · Answer

Thanks for the feedback, I see better performance while scrolling

Sangavi Periyannan · Answer

Junior Saravia,Glad that your issue is resolved!! Please let us know if you need further assistance. As always, we are happy to help you out.

MITTON · Answer

Thank you, I have the same slow scrolling issue. Putting the SfListView inside a ScrollView works, but then how to scroll to an item, and load more on scroll end ?

Suthi Yuvaraj · Answer

Hi MILLTON , We would like to let you know that when using SfListView
inside the Scrollview, you need to set the IsScrollingEnabled to false, which
disables the default scrolling of SfListView, which restricts all the
scrolling-related features in SfListView, which is a known limitation at our end.
Hence we have internally logged a bug report to improve the scrolling
performance of SfListview, which will be fixed in our upcoming Vol1 release ,
planned to be rolled out in the middle of March 2024. We will appreciate
your patience until then.RegardsSuthi Yuvaraj

Den Kasakov · Answer

Standard .NET MAUI CollectionView with Vertical ItemsLayout works for such case

Suthi Yuvaraj · Answer

Den Kasakov,We have checked your requirement , we would like to
let you know that CollectionView is not a Virtualization control,The .NET MAUI ListView (SfListView) has been built from
the ground up with an optimized view reuse strategy for the best possible
performance on the maui platform even when loading large data sets. Also we are currently working to
improve the scrolling  performance which will be available in our weekly
nuget release , which is planned to rolled out on March 26, 2024. We will
appreciate your patience until then.

Suthi Yuvaraj · Answer

Hi ,We regret to inform you that, we are including the performance improvement in our Vol1 release, Given that scrolling is a fundamental feature, it requires extensive testing. Our team is currently engaged in rigorous feature matrix testing alongside the modifications, which necessitates a few additional days to finalize the testing and enhance the control's stability. Hence we will include the changes in our weekly nuget , which is planned to be rolled out on April 9, 2024. We will appreciate your patience until then.

Suthi Yuvaraj · Answer

Junior Saravia,
We would like to let you know that Essential Studio Weekly NuGet packages (v24.2.5) has been published in nuget.org with the fix for the issue “Slow scrolling using complex DataTemplate with SfListView”. Please let us know if you have any concerns in this.

James · Answer

We are still seeing issues with performance and scrolling.

We added a scrollview around the SfListView (as recommend above) and the difference in performance is staggering. Its lightening quick compared.

We have optimised our code as much as possible and use templates and still the performance is slow. Our SfList does not update dynamically with objects being added or removed when being viewed so not sure why the performance is so bad.

Is there any current work in this area going on?

We are on SF 27.1.48

Jayashree Ravishankar · Answer

Hi James,

Based on your update, It seems you are using multiple templates through DataTemplateSelector. So in this case, a new template is generated each time you scroll. This can cause performance issues, especially with complex layouts.

To enhance performance when using multiple templates, you can return a cached template in the OnTemplate() method.

Please refer the example code snippet:

public class CachedDataTemplateSelector : DataTemplateSelector

{

// Dictionary to store cached templates

private readonly Dictionary<Type, DataTemplate> _templateCache = new Dictionary<Type, DataTemplate>();

// Define your DataTemplates

public DataTemplate TemplateOne { get; set; }

public DataTemplate TemplateTwo { get; set; }

protected override DataTemplate OnSelectTemplate(object item, BindableObject container)

{

// Get the type of the item for caching purposes

var itemType = item.GetType();

// Check if the template is already cached

if (_templateCache.TryGetValue(itemType, out var cachedTemplate))

{

// Return the cached template if found

return cachedTemplate;

}

// Otherwise, calculate the template based on item properties (your custom logic here)

DataTemplate selectedTemplate;

if (item is ItemTypeOne)

{

selectedTemplate = TemplateOne;

}

else if (item is ItemTypeTwo)

{

selectedTemplate = TemplateTwo;

}

else

{

// Default template or null if you don't have one

selectedTemplate = null;

}

// Cache the selected template for future use

if (selectedTemplate != null)

{

_templateCache[itemType] = selectedTemplate;

}

// Return the newly selected template

return selectedTemplate;

}

Caching: Caching the results of the SelectTemplate method in the DataTemplateSelector can help avoid recalculating the template for each item. You can maintain a dictionary to store previously selected templates based on the data type.

Regards,

Jayashree