seatgeek / react-infinite

A browser-ready efficient scrolling container based on UITableView
Other
2.71k stars 274 forks source link

Inconsisent scrolling preload? (video/gif inside) #256

Closed jwmann closed 6 years ago

jwmann commented 6 years ago

react-infinite v0.12.1 OS X 10.11.3 Chrome Latest

I'm not sure what I'm doing wrong here. You'll see in the GIF I'm scrolling very slowly, initially the menu items are appearing fine and then eventually they just... stop and then randomly infinite sort've catches up and loads in items.

I've tried every combination of preloadBatchSize and preloadAdditionalHeight

Right now I have preloadBatchSize set to

preloadBatchSize={InfiniteScroller.containerHeightScaleFactor(2)}

Check out my GIF - https://jwm.d.pr/eTkpoZ image

The only time I got it actually smooth with no hiccups was when I set preloadBatchSize to

preloadBatchSize={2000}

This also has the same problem.

Of course that's not very efficient. Any ideas?

garetht commented 6 years ago

In the past when this issue has come up it is because the elementHeight set does not correspond to the actual heights of the elements in the scrolling container. Can you check that?

jwmann commented 6 years ago

@garetht You're correct, there seems to be discrepancy in what I'm setting the height as and what this module is rendering them. I need to do a bit more testing but I think this fixes it!

Thank you!

jwmann commented 6 years ago

After some testing. This was absolutely the issue. Thanks again!