clauderic / react-tiny-virtual-list

A tiny but mighty 3kb list virtualization library, with zero dependencies 💪 Supports variable heights/widths, sticky items, scrolling to index, and more!
https://clauderic.github.io/react-tiny-virtual-list/
MIT License
2.46k stars 166 forks source link

[Question] Max height div #62

Closed jeroenransijn closed 6 years ago

jeroenransijn commented 6 years ago

I am running some tests as to render lists with 100k–1m rows. It seems that browsers have a max height for divs: 1.67771e+07px for me on Chrome Mac. It seems that react-virtualized somehow handles it. This is very much an edge-case, but just curious if anyone is aware of this? Feel free to close issue.

1.67771e+07px => 16,777,100px

clauderic commented 6 years ago

@jeroenransijn this is a known issue, your mileage will vary depending on which browser you're using. react-virtualized handles this in a pretty clever way, by "scaling" down the rows that are not currently visible, but it also leads to a lot of complexity in the code. I deliberately chose to ignore that use-case for react-tiny-virtual-list to keep things small and easy to maintain.

I honestly don't know of many use-cases that would require rendering that much data, and I'd argue that a list may not be the best UX to display so much data anyhow, which is another reason why I chose to ignore that use-case 🤷‍♂️

See this issue in react-virtualized for more context on the matter https://github.com/bvaughn/react-virtualized/issues/396

Having said that, it might be something worth documenting, as part of a known limitations section. Would be happy to accept a PR to that effect 😉