Lazy load items

Question

Lazy load items

sindresorhus opened this issue 5 years ago · comments

This is a very useful project. 🙌 I use it to show a lot of images in a waterfall grid. However, the API I'm using uses pagination, so I need to load the next page from the API when the user scrolls to the bottom (actually before the bottom). Do you have any plans to add support for infinite grid? Or maybe hooks to enable this use-case?

Alexander Young · Answer 1 · Fri Mar 13 2020 00:51:46 GMT+0800 (China Standard Time)

@sindresorhus I think there is a way to do it right now. Let me double check and I'll get back to you.

Alexander Young · Answer 2 · Sat Mar 14 2020 02:29:48 GMT+0800 (China Standard Time)

@sindresorhus I just checked and this is as simple as doing this.

self.items += nextBatchOfItems

Just append new items to your array. Grid will see the change and recalculate the difference. It even preserves the scroll position. I'm going add this to examples and I'll post a reference here later.

Alexander Young · Answer 3 · Sat Mar 14 2020 02:42:48 GMT+0800 (China Standard Time)

@sindresorhus this however will only support loading items as they become available, not when user scrolled to the end on the grid. This is definitely something we should do but I'm not sure what is the best way to do it in SwiftUI now.

Sindre Sorhus · Answer 4 · Sat Mar 14 2020 14:31:53 GMT+0800 (China Standard Time)

I did some more research on this and it seems like the common workaround for knowing when to lazy load is to use .onAppear on the elements. Would be nice if Grid could handle this somehow.

Example: https://github.com/crelies/List-Pagination-SwiftUI/blob/e41a0d0b2ffab260a14345e42e1cf1fa3822e1b2/SwiftUI-List-Pagination/View/ListPaginationExampleView.swift#L29-L31

Alexander Young · Answer 5 · Sun Mar 15 2020 06:05:20 GMT+0800 (China Standard Time)

@sindresorhus with the release 1.0.0 grid is now a lower level ui element (like HStack) and ScrollView has been removed from it. This means that behaviours like pull to refresh and lazy loading have to be added at a ScrollView level. I'm closing this because it is now out of scope for this project.

Sindre Sorhus · Answer 6 · Sun Mar 15 2020 18:43:31 GMT+0800 (China Standard Time)

@ay42 This is a really good change. Makes it much more flexible. 👍

I did some more research on this and it seems like the common workaround for knowing when to lazy load is to use .onAppear on the elements. Would be nice if Grid could handle this somehow.

I tried this out, but the elements in a Grid triggers onAppear for all elements right away, so it's not feasible...

TJ Horner · Answer 7 · Wed May 20 2020 23:42:21 GMT+0800 (China Standard Time)

@sindresorhus I'm experiencing the same behavior. Have you found a workaround for onAppear firing on all grid elements at once? I was thinking maybe calculating the current scroll position vs the position of the grid element, but not entirely sure if that would work.

Sindre Sorhus · Answer 8 · Wed May 20 2020 23:58:07 GMT+0800 (China Standard Time)

No. I gave up on it. Went with paging instead. Hopefully, WWDC will bring enough SwiftUI improvements to make this feasible.

TJ Horner · Answer 9 · Thu May 21 2020 13:52:38 GMT+0800 (China Standard Time)

Hopefully, WWDC will bring enough SwiftUI improvements to make this feasible.

Amen to that :)

Thanks for the response.

TJ Horner · Answer 10 · Sun Jun 28 2020 11:42:31 GMT+0800 (China Standard Time)

For anyone that comes across this in the future, Apple added LazyHGrid and LazyVGrid which lazy loads items as they come into view. However, as far as I can tell, it's not as simple to implement a staggered grid with these views.