Render new rows on scroll

[igorpost92]

Hi.
Is it possible to make virtuoso render new rows during the scroll?
Right now it renders new rows only when scroll gets close to the latest. I would like to render a few new rows before and after current rows during the scroll (like it works in react-vitrualized for example). Because i have complex rows and when user scrolls very fast there are blank spaces.

[petyosi]

No, this is not supported currently. Quite a few people have asked about it, I am open to PR on it, although I would personally not recommend using that approach.

[igorpost92]

Is there any way to avoid these blanks when user scrolls very fast?

[petyosi]

You can try using the scroll seek placeholders which allow rendering of lighter components when scrolling fast.

[igorpost92]

But i have cards of various heights and these cards will be jumping when user stops the scroll

[petyosi]

In that case, you can try implementing the viewport boundaries increase and see if it works for you. If it does, I am open to a PR.

[petyosi]

I've recently introduced a property that can address that - increaseViewportBy (working like overscan in react-virtualized).

[lexahall]

Does this property not apply for VirtuosoGrid? Is there any equivalent?

[lexahall]

@petyosi is there any support for this with Grids? I'm planning to try just implementing my grid as a list of rows instead, so that I can use the increaseViewportBy, but just want to make sure I didn't overlook something in the docs.

[petyosi]

@lexahall I don't provide free support over GH issues and discussions. Everything which the library supports is documented. If something is not there, you can read the source code. If something does not work as you expect, you can submit a PR or sponsor the development of the feature.

[lexahall]

Sure sure, I didn't see anything in the docs or source code for this. So I can definitely look into adding support for increaseViewportBy for Grids. I just wanted to make sure I wasn't misunderstanding anything before taking that next step. Thanks for the quick response - I really appreciate all the work you've done here.

[igorpost92]

Hi. I noticed, that increaseViewportBy takes size in pixels, while overscan in both react-virtualized and react-window takes items amount.
What the difference between increaseViewportBy and overscan in react-virtuoso?