Lazy Load with Dynamic Data

[Teodor]

You can use the Lazy Load Component with dynamic data.

We have a dynamic masonry layout on our page, created from a database query. You can use any dynamic source of course - database, API data source or JSON file. Masonry is also not required, we just like it and that's why we added it

So, inside the repeat region, add new element:

Open the content category and select image:

Do not use the standard src option, it should remain empty. Enable the responsive option for your image, as you are usually doing for responsive images:

Add new dynamic attribute:

Open the Display category and add Dynamic Lazy Load:

Click the dynamic data picker button, to select your dynamic image source:

Select the binding you need and click the select button:

And you are done! Lazy Load has been applied to the dynamic images in your repeat region:

You can see the results in your browser. Only the needed images are loaded on page load, the rest are being loaded while you scroll down:

[mymdsdigital]

I am sure is me doing some thing wrong, but wondering if the Dynamic Lazy Load only works with images?

I have a set of records that I want to repeat, and when the page user gets to the points to where the records are I would like to use the Dynamic Lazy Load

However, when trying to add the dynamic attribute I can find it. I am not sure if this could be added from somewhere else, or what i am trying to do can’t be done.
Thanks
Juan

[Teodor]

@mymdsdigital

wondering if the Dynamic Lazy Load only works with images?

Yes, lazy load is for images only.

[mymdsdigital]

@Teodor, thanks for letting me know! wondering if there is an alternative at all?
Thanks again for your help
Regards
Juan

[mgaussie]

Teodor, can the same be applied to all types of data or just images?

[Teodor]

Hello, the lazy load options are available for images only.

[mgaussie]

Ok, no problem. Could this be a nice little feature request? Beneficial for long lists of data with an infinite scroll

[Teodor]

I believe there’s a feature request for infinite scroll, you can vote for it

[mgaussie]

Ok, I’ll see if I can find it. Thanks Teodor.

[brad]

There is actually three feature requests for it ....

Infinite scroll

infinite scroll would be awesome guys

Infinite scrolling

Hi there, altough it is somehow possible, a nice addition would be infinite scrolling

Infinite Scroll (loading data fom server connect) Similar to Lazy Load

These days, mobile users EXPECT data to be loaded on scroll. Gone are the days of Pagination. PLEASE implement the “Infinite Scroll” feature so we can load our records a few at a time from large datasets when the users has scrolled down far enough. I did request this feature back on Dmxzone over a year ago and @Teodor said it was being worked on… PLEASE VOTE FOR THIS FEATURE WAPPLER COMMUNITY!!!

[TomD]

I think these threads should be merged.

I thought there was a fairly straightforward way to do this in Wappler as it is, but the method mentioned in this thread is not ideal (as explained in the thread). Hopefully this issue can be overcome when the feature is implemented.

I think it would be useful to have a ‘show more’ button as an alternative to infinite scrolling. I know this can be done quite easily, but if it can be done without the issue referred to above, it would be a great feature. Also, there are usability issues with infinite scrolling which in some situations are addressed by a ‘show more’ button.

[Peter]

How many beers do we need to send to get this vote bumped up the list?