React-window: Upper limit on number of rows?

[delateurj]

Hi,
Thanks for your work on this. I was doing a little testing of how very long lists are handled.
I noticed that in the example Fixed Sized Grid in code sandbox it will only handle a row count up to 958698. Any value greater than that and it does not display rows beyond row 958698 (index 958697). I am not surprised there is some upper limit just due to memory and variable maximums, just wondering if this level was surprising and if one can estimate the upper limit of rows/cells.
Thanks.

[delateurj]

Did a search over in react-virtualized and I think this issue https://github.com/bvaughn/react-virtualized/issues/193#issue-149169529 is the same question and I see its related to maximum number of pixels supported by the browser...so I'll close this. Please reopen if you think this should be different in react-window. Sorry I didn't look in react-virtualized first.

[bvaughn]

Hey @delateurj! The issue you linked to (bvaughn/react-virtualized/issues/193) is definitely related. Browsers have a maximum pixel size that they support. For newer browsers, that pixel limit is really high.

In react-virtualized, I implemented a workaround for this (ScalingCellSizeAndPositionManager) but abstractions add cost both in terms of maintenance and runtime performance, and I decided _against_ adding a similar workaround in react-window.

My main reasons for this decision were:

1. Newer browsers have a much higher pixel threshold so this is becoming less of an issue over time.
2. The user experience of in-browser lists that exceed this threshold is arguably poor to begin with. It's conceptually nice to be to render a list of one million items, but it's not practical to load so much data on the client, and it's not user friendly to make people scroll through such large lists without some sort of secondary filtering/sorting controls.

Hope this explanation makes sense and is useful to others who come across this issue in the future.

[delateurj]

Thanks. Decision/explanation makes sense...was exploring the edges.