-
-
Notifications
You must be signed in to change notification settings - Fork 380
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Virtual Rows Blink When Rows Have Varying Heights On Scroll #37
Comments
I'm exploring if I need to roll back to a previous beta version of |
as of |
@KevinVandy I am afraid that issue still exists after rollback. Scroll more and you will find some rows flickering. Both from online storybook and my local clone storybook. My browser version is Chrome 104.0.5112.81. |
By flickering do you mean that it takes a second for the new rows to fully render in? Or are you still seeing large up and down vibrations that never stop? There might always be some delay in the rows rendering. The uncontrolled infinite bouncing up and down is what I'm hoping is solved now. |
@KevinVandy it's about the vibrations. It might be some calculation edge case in that library. |
@scott-avery I've tried to find the problem on v0.36.0 on a Mac, Windows PC, and Android phone, and don't see the vertical vibrations anymore on my storybook or docs site. I can re-open if it is confirmed to still be happening though. More work in general is needed for virtualization performance. Really want to be able to use |
Tried for hours to improve this, but it seems to be a flaw with react-virtual where when rows are differing heights are scrolled into and out of view at the same time cause this jitter. Slight improvements have been made by using some measureRefs internally, but the main fix is to ensure all rows have the same height. Setting a |
good job. I will also investigate how to improve it later. |
That's kind of the nature of the beast. The more features you enable, and the more rows and columns you render at once, the lower the performance will be. I recommend using pagination in those instances. It does appear that virtualization and row expansion don't play well together. Makes sense as any row height variation seems to confuse |
It's so sad. But I'll still look for a solution, if I write something here or expose it to you PR |
Good News. This will be fixed in v1.4. Thanks in part to @AndreyGrek 's PR. |
@AndreyGrek @scott-avery @e-cloud For those of you still using this library, v1.4.0 now has addressed the major problems here. This should be fixed |
material-react-table version
0.33.6
Describe the bug and the steps to reproduce it
Your Minimal, Reproducible Example - Sandbox (Recommended) or code snippets
https://www.material-react-table.dev/?path=/story/features-virtualization--enable-row-virtualization
Screenshots or Videos (Optional)
Do you intend to try to help solve this bug with your own PR?
Maybe, I'll investigate and start debugging
Terms
The text was updated successfully, but these errors were encountered: