Template7 image loads

I have a page inside framework7 using template7. I’m passing a JSON with same date and in that date are image file names. Inside the template7 page I’m dynamically creating multiple row, each with a picture and some text from the JSON.

It works great, BUT each time I open the tab with that page the image takes a moment to load but the text is there instantly. Is it the right way to implement the dynamic images through filenames? Why does it load a moment?

Thanks in advance!

Because this is how browser work, it needs some time to load images when tab becomes visible

If you want the images to load instantly, you may want to use some kind of pre-load method onto a div that is invisible, then swap it to visible when required. Note that it’s probably not a good idea to do this with very many images, as it does consume bandwidth and cpu to load and hide the images before they are actually needed.

1 Like