Any Component severe lag in app when cloning 20+ times

Thunkable Discuss
#1

My app is cloning a list of roughly 300-400 items, from Airtable.

The cloning works that there are two buttons, one on the left and one on the right, in a row. I clone this row and set the buttons background to a specific picture, and then the label which is just below each button.

Everything works smoothly until it hits around 40 items in the list (20 rows in app, as there are two in each row).

Is there a recommended limit for this? I mean, It is very very laggy. I cannot scroll the screen without a delay, and the fps drops to about 10 or 8 at times. Mind you, I am running a fairly powerful device, Samsung G S8. It’s not old, and is running latest Android.

The app lags both in live test companion app and when I download the APK.

(edit)

i forgot to mention, after testing, it only lags when images are loaded in. It is fine if I do not load in images.

1 Like
#2

Yeah.
I also noticed it when I was developing a simple photo wall in Thunkable X… :roll_eyes:

For having a look @ How fast does my app loads the list of 150 cloudinary images’ URL??
I added ~150 images in Airtable, and compiled the App.
I saw, 10 images showed up quickly. The rest after ~50, took 4-5 seconds (or even more) per image.

Yes.

Thanks! :smile:

#3

I looked into it more online, I think it is to do with Photo Resolution also. I am loading in photos that range all the way up to 2000x2000 pixels respectively.

This is quite irritating I must say.

2 Likes
#4

I loaded like 500x500,
HD Pics of Garfield. :smile:

1 Like
#5

ahahahaha

1 Like
#6

This block should be fluent to use…

#7

Here is me thinking clone block would give us no limitations…

Another limitation to add to Thunkable X.

2 Likes
#8

When cloning, a new object is created. Creating an object requires a lot of time and a lot of memory. The cloning operation cannot be used as a replacement for the list, and even on a very powerful phone there will be braking (this is a limitation of the Thunkable X platform and other technologies that are used in this).

2 Likes
#9

Eoin, are the images for your buttons files that you uploaded via Thunkable or are they URLs?

-Mark

1 Like
#10

Hi Mark, thanks for your reply. Yes the images are links, which are from many different sources. I search Google for the image, then I copy the file URL from there and paste it into Airtable.

Thanks

1 Like
#11

Got it. Yeah, I think we need to do a better job of dealing with URL-based images, although it will be difficult when they come via a dynamic source like Airtable. We could presumably do a much better job if the URL is specified in the designer.

-Mark

1 Like
#12

For me, I must use a database as such, Airtable being a good choice of course. I’m just pulling from a list, which is a column in Airtable. And I simply set button 1 to item 1 in list, then button 2 to item 2, and so on.

Any recommendations on what I could do to help this? It would be great to have 200 or do buttons.

Thanks again for your reply.

1 Like
#13

Do these buttons invoke a user-defined function or do they act as links to a phone number, e-mail, etc.? Do your buttons have text?

The first option is data loading. Display data in portions of 20-30 buttons (in online stores, this is often used). Bring them out, then remove them and bring out the next batch.

Another option is to revise your algorithm for optimization purposes. If the concert grand piano does not fit in your home, then buy a synthesizer. It sounds good too. So think about whether you can replace a bunch of buttons with a list.

#14

By the way, how do you load data from AirTable into the application? If the line is looped, then this is an inefficient algorithm.

#15

@actech on your first point:

When the button is clicked, I use the any component get button photo. This gives me the link to the photo. Then in Airtable I retrieve the photo from its column, and after I get row number, I move to a new screen and pull all the necessary data from there. It works very well.

on your second point:

I get two columns from Airtable. I only ever call to Airtable twice on app start up. From there, I set the first button to the photo column. and the first label below the button, to the button column. So there is a button with background picture and a label for every item also.

So for my app style, I need the photos to be displayed the way I have it working. My only other option is to add a next page or previous page option, but I would like to refrain from using that method.

I will send you a screenshot of the app as soon as I can to help you better understand.

Thanks.