Jumpy scroll in a Dash DataTable

Dear all,
I’m having some issues with scrolling the DataTable I have in my app. Basically, there are jumps forward in the scrolling as the top row is about to go off-screen.
You can feel it yourself if you go to https://rubriker.nu from a mobile phone and try to scroll the table in the bottom of the app.
Here is a quick video I made to illustrate

I suspect that the issue is connected to the fact that I use markdown cells, with several text rows in each cell. Some also include an image.

Any ideas on how I could fix this?

Jumpy and unpleasant indeed! You’re most likely correct that it has to do with the multiline content, and mistakes we make in adjusting the scroll for the height of rows that we stop rendering when they scroll far enough out of the visible area. I’m not aware of a workaround, but to help us investigate the bug are you able to post the code, or at least the props and some representative data for the table?

2 Likes

Hello and thank you for the reply!
I created a minimalistic app, which I believe exhibits the issue discussed
https://github.com/timofeymukha/datatable_scroll_issue

It’s quite sensitive, it seems. I am toying with different screen sizes via F12 in Chrome and here for phones I see the jump, but not for tablets. For my own main app, I see the jumps for tablets as well.

Spinned it up on Render
https://datatable-scroll-issue.onrender.com/

1 Like

Hi @timofeymukha ,
When I open this app on my pixel 6a Google phone, the table scrolls just fine, with no jumps.
Are you getting a different experience?

I open that with cellphone android, Galaxy A52s and don’t have problem.

@adamschroeder I also have a Galaxy A52. If I open the app in vertical screen, things are smooth. But if I then rotate the screen into landscape mode, I get jumps! However, if I reload the app in landscape mode, it is smooth again. And if I rotate to vertical and not reload, things jump…

Things seem a bit more elusive in the test app compared to the table at rubriker.nu
I should perhaps put more effort to get the jumping behaviour more consistent in the test app.

Dear all, I’ve updated the test app by making the length of the second line alternating. Now I always get jumps both on my A52 and my Ipad Pro :slight_smile:

hi @timofeymukha
Thank you for creating a sample app that replicates the problem. I’ve opened an issue on our repo.