What's the correct way to append items?

[gajus]

I am confused what is the correct way to append items when you have very large array.

As an example, I've tried using useRef to append to the array and then force refresh.

https://codesandbox.io/s/react-virtuoso-component-list-re-render-forked-92iwn?file=/src/App.js

This works, however, it is still recalculating itemContent every time totalCount, i.e. I would not expect it to try to re-render elements that are already visible. Therefore, I suspect that I am doing something wrong.

We can obviously memoize whatever element itemContent returns, but again, I am just not sure if this is the correct approach.

[gajus]

Performance sections of the docs actually suggests to memo the itemContent component.

https://virtuoso.dev/#performance

It appears that this is therefore expected behavior.

Would still appreciate an example in documentation of appending to a large list, e.g. I would expect that data allows to pass a reference object, but it only allows to pass an array. And otherwise these is no way that I can see to access data in itemContent efficiently.