Does A Table (React Aria Components) Offer Virtualization Out Of The Box? #4575
-
|
Disclaimer: Front-End Noob. Hi everyone, please consider this codesandbox. The sandbox contains two tables with 300 rows each. The table on the left is implemented using React Aria Components, whereas the table on the right is implemented using React Spectrum. When inspecting the DOM, you can see that the Spectrum table utilizes virtualization, whereas the Aria table does not. My question is this: Does the Aria table have virtualization built in and if so: How do I have to provide data and which CSS attributes need to be set in order for the virtualization to become enabled? If the Aria table does not have virtualization built in but the Spectrum table does than my question is: Why is this the case and will this continue to be the case? From my naive point of view and understanding about both of these libraries I was expecting them to behave the same w.r.t. virtualization. Finally: The Aria Thanks! 🙂 |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments 2 replies
-
|
Hey! Thanks for the message. Aria does not contain any virtualization. This is because it should be usable both with and without virtualization. React Spectrum supports it because that is our business need. We wrote Aria examples without it to ensure that worked as well. Theoretically, you should be able to use any virtualization library in tandem with our hooks. Here are some related discussions #4367, #4393, and #4431 |
Beta Was this translation helpful? Give feedback.
-
|
Ok thanks! If possible and just for me to have a pointer: I believe that this would definitely require me to use the lower level hook-based API as is mentioned here right? There is no way to get this behavior by just using the components based api? |
Beta Was this translation helpful? Give feedback.
-
|
We don't think that's possible right now, hooks would be the way to accomplish it. We have some ideas on supporting this in the future, but we have not had time to try them out and probably won't have time for a while. |
Beta Was this translation helpful? Give feedback.
-
|
Virtualizer is now documented: https://react-spectrum.adobe.com/react-aria/Virtualizer.html |
Beta Was this translation helpful? Give feedback.
Hey! Thanks for the message. Aria does not contain any virtualization. This is because it should be usable both with and without virtualization. React Spectrum supports it because that is our business need. We wrote Aria examples without it to ensure that worked as well. Theoretically, you should be able to use any virtualization library in tandem with our hooks. Here are some related discussions #4367, #4393, and #4431