Blank table when fast scrolling on MS Edge

pupudu / window-table

Windowing Table for React based on React Window

https://window-table.netlify.com/

170 stars 13 forks source link

Blank table when fast scrolling on MS Edge #32

Closed thunderkid closed 4 years ago

thunderkid commented 4 years ago

If I open the demo site https://window-table.now.sh/ on MS-Edge (Windows 10 1903 build) and scroll slowly, it works ok. But if I scroll quickly, the body of the table suddenly goes blank, and stays blank even if I then scroll slowly.

pupudu commented 4 years ago

Hi @thunderkid Thanks for reporting this issue. This issue can be reproduced on browser-stack.

My initial guess is that this is either a performance issue in MS Edge or a limitation of react-window (the base library which enables table virtualization). I've seen similar behavior in Chrome when the row count is millions.

It seems MS Edge can't handle more than 22000+ rows. view on imgur

Technically, I don't see why the number of rows becomes a problem since html elements are added and deleted as we scroll. I'll check with react-window as well, to see if there is a solution for this.

thunderkid commented 4 years ago

Yes, now that you mention it I'm seeing that the error occurs after row 22k. Which makes no sense - I'd have thought that since DOM elements are added dynamically, MS Edge shouldn't even know or care which row it's on. It should always think it's only displaying about 12 rows.

pupudu commented 4 years ago

Yea I agree. I am gonna throw this question at Brian Vaughn. He will have a logical explanation for this. I need to reproduce the problem solely from react-window before that. I'll try to do that today or tomorrow eod.

pupudu commented 4 years ago

This issue has been fixed in the latest Edge browser (thanks to the new chromium-based engine)