[Solved] Help with lots of images and lag

Hi everyone.

Currently the main function of my app is, there is one screen when a user clicks a button, a random image is shown (out of 130 images, an image is chosen). There are actually two of these buttons on the same page with 130 hidden images each. In other words, 2 buttons and a total of 260 or so images are hidden until buttons are pressed and images are chosen at random from a list to display when the button is pressed.

My app works perfectly fine, except my end-users are saying there is a lag when first opening the page mentioned. This makes sense because I probably did not choose the best way to program this.

Does anyone have a suggestion how I can reduce lag and still have a random photo be shown from a list of 130 after a button is clicked?

The photo attached is only a partial screenshot of the main blocks.

You guys are the best and thank you in advance!

1 Like

Hi @richardmconley4! :wave:

Here is an example:


Here is an alternative to your method. First write down the name of each photo that you want to use and put this in a list. The easiest way to manage this list would be to keep it electronic. next
add all photos to the invisible components section.

Then in your block editor, Create a list of items in which each item is the exact name of the picture that you would want to use as a background. The names in this list should match the file name exactly and this is why you write it out using an electronica method and not pencil and paper. And electronica method will allow you to copy and paste ensuring that you get each letter, spacing, and capitalization correct.

I provide the instructions that upon a button click the background should be set to a random item from the list that contains the names all of the background images.