Custom Lists on Android are slow

What is it with custom lists and Android builds? I just created a new custom list as it is the only way to incorporate a rating icon (or star rating) to show average ratings on our listings. My list only has 30-40 items. On iOS, app works just fine and the custom list loads smoothly and quickly. On Android, its a totally different story. Half of the list images load, others do not. But scrolling up/down the list is unbelievably glitchy! The app feels so slow on Android, no customer would agree to put their CC details and pay on an app this slow.

I read several other posts in the forum and tried all suggested solutions. No improvement. It just seems to me at this point that there is something wrong with Custom Lists and Android builds.

I wanted to know if anyone here faced similar issues and actually managed to solve it?

Hello, yes the custom lists are slow in android, especially if the collection has +20 items. I think that rhe only solution is to replace it by a card list and it will work perfectly.

1 Like

Thanks Ali,
Yes it seems there is no way around for this. Using custom lists on Android simply won’t be possible until Adalo fix it.

The issue is not with custom list, anything will be slower in general on Android for many reason, I had a nightmare with Android phones on my app earlier, but managed to solve most issues and now my app is running on 3-4 years old android phones, still much slower than IOS but acceptable

What I did is mainly getting rid of any long list by keeping them in categories to reduce the load, and a major change is in images since you mentioned that, you need to compress and reduce images size while displaying them on the app, you should not load large images

That’s embarrassing!

1 Like

Hello Mohammed,

Actually, our app is faster on most Android devices than iPhone. Even 5 year old Android devices, performs very well. As fast, if not faster than iPhone.
We also optimized our images the best we can without sacrificing quality.

If we use custom list that shows just 10 items, Android struggles…
We even tried with custom lists without images and with 15-20 items, Android still struggles.

Many other posts highlighting the same issue. I submitted a ticket to Adalo recently and they are actually looking into it.

Yes …

Thank you all, let us know please, in Europe that’s a problem cause for example in Italy only 20% have IOS/Apple devices.

Hello @Filli, @mohmdfawzi and @Ali-Bazzi

Just wanted to let you know that I have found the root cause to why my custom lists had slow performance on Android devices. It was related to the Image Component within the custom list.

I solved this by trial and error, tried many options till I got to this :slight_smile:

Utilize IMGIX url parameters to set the height and width of the image (snapshot below)
So it’s the imageurl followed by “?auto=compress&w=500&h=750”

You see, this image component does not give you an option to choose Landscape, Portrait or Square layout as opposed to the standard Card List offered by Adalo which allows you to choose those options. Most likely once you choose one of them, it locks the aspect ratio and auto compresses the image to deliver the best result.

Adalo can just add that as an improvement to the Image Component itself, and from there many custom list problems would be fixed :wink:

1 Like

good to hear that, actually I have mentioned that you need to optimize the images in my post above but you said that you have done that already!
the URL with compression parameter is what I meant
no one should show the images as is in the app, always should be resized/compressed

good luck with your app

I had optimized the image sizes prior to upload by limiting them to 50kb each. But didn’t use IMGIX back then.

Thanks tor your tips

1 Like

Hey, are you saying that the custom list is the primary reason for Android’s poor performance? Most of my lists are custom-made. Do you believe that if I compromise on custom UI and adopt Adalo’s native list components I will get better performance on Android?

1 Like

Hello Bruno,

Since I last commented here, I have found ways to make custom lists load quite fast (as fast as iOS) on Android. However, please note that app performance in general is also dependent on the phone’s capabilities.
Adalo apps on iPhone 6/7 will not perform as fast as it would on iPhone 13/14. Same thing goes for Android devices.

Generic Tip: Use Standard lists everywhere you can. Limit the use of Custom Lists as much as possible.

So lets talk about what we can control to make our Adalo apps faster.
At the end of the day, custom lists are super powerful and can be critical to your UI/UX as standard lists don’t provide what you might need.

Tip #1 Image sizes in custom lists are key to the performance of the list
If you are using Adalo DB to host images, try your best to reduce the image size (in kb) before uploading. When the app loads those images, adalo by default applies “auto=compress” to all images in the DB so it optimizes the size. Having said that, I have found that this is good but can also be improved.
What I do is I add more IMGIX parameters at the end of the image URL so it reduces the image size even further, without sacrificing quality. Snapshot below for reference.

If you are using External DB (like Xano or Airtable), then IMGIX parameters won’t work there by default. The best you can do is reduce the size of the image prior to uploading it onto those databases.

Tip #2 Reduce Visibility Conditions for components inside the Custom List
Say you have a custom list that contains a Text Field, an Image, and a button. Most likely, you are building a custom list because you want to have control over the design of the list + the conditions under which it displays the information. From experience, designing a list that consistently displays all its components WITHOUT the use of conditional visibility has served me very well.

Tip #3 Use Adalo’s standard components inside the Custom List instead of custom/private components
Adalo’s standard components perform quite well (text fields, images, icons, toggles, etc). Reduce the need to use any custom components as not all are optimized for best performance. But you can give it a shot and test using trial and error

Tip #4 Minimize collection DB items a list has to load by using filters
Another general advice for all lists is to filter what the list will fetch from the DB. In my experience, loading 20 DB items has been pretty good. You can use Lazy Scroll to load items as users get down the list. But I do not like it so much as there is no loading spinner or any indication (for the user) that the list is loading more items. Some others solve this by adding a button, others have build custom components. But I like to keep it simple, and just do my best to not load >20 DB items in a list on 1 page.

Tip #5 Do not use Shadows
Try not to set Shadows on for any rectangles or components that allow it. I have found that shadows do not perform that well on Android devices in general.

Tip #6 Design on small screens and center your list
I set the width of all my screens to 375 so it can match pretty much most small phone devices.
Responsive design is a big topic and I won’t dive into it here, but what you should do is design on small screens (i.e. width 375) and center your items in the middle of the screen as much as you can.

This way, Adalo can have an easier job doing its responsive design on bigger user devices.
This is another one of those “Trial and Error” kind of tips that would require few iterations till you find the best option for your designs.

Hope this helps! Let me know if you still have any questions.