Scroll jank when scrolling up

Scroll to the bottom of a long thread and refresh the page.

Grab the scroll bar and scroll up to the top of the page. You’ll see a loading spinner while the previous posts load. (You can make this problem more obvious using a network conditioning tool, e.g. Chrome Dev Tools Network tab, Slow 3G.)

Actual: As the posts load, the scroll jumps around.

In the linked video, you can see that RBoy’s post #76 “Maybe codinghorror can confirm” is at the top of the screen; then, when the subsequent page finished loading, the scroll jumps up to lid’s post #9 “It will be interesting to see if…”

Expected: The previous page should appear without disturbing the scroll position; whatever I saw on the screen as the previous page loads should still be on the screen when it’s drawn in.

Onebox seems not to be working with my Google Drive link. Let’s see if this works: https://drive.google.com/open?id=1ny2zYNegggQ3uPlhG9t-tEB3xkUSepcE

That just looks like posts are loading as you scroll up. It’s worse when you limit network speeds because the data takes longer to traverse a slower network.

Try scrolling using the handle on the timeline scroller. It won’t jump around because more posts aren’t being loaded ahead and causing the position of the scrollbar to be recalculated. It’s a big part of why it’s there to begin with.

I agree that this is happening because the posts are loading. With a slow network, I can reproduce this just scrolling with trackpad/mouse wheel. (Would it help to post a demo video of that?)

This problem is occurring only when scrolling up because when scrolling down, Discourse draws in a bunch of grey filler; when the posts become available, they pop in right where they’re supposed to be and the scroll doesn’t jank.

It happens because pages are rendered from top to bottom, Discourse doesn’t know the height of posts before they arrive. I can see the scrollbar hopping around as you drag up, using the scroller at least mitigates against the problem by scrolling to the absolute top of each reply.

2 лайка

I think all that’s needed is grey filler at the top, just like scrolling down.

@eviltrout spent a fair amount of time optimizing up scroll, it was quite a few years ago so maybe we are due to have one more look

3 лайка

For the record, this is a very difficult problem. And scrolling down is fundamentally different because you’re not stacking things on top of the viewport. A variable height post causes no problems when added to the bottom, but consider what it does when stacked on top.

5 лайков

Наше сообщество недавно начало сталкиваться с подергиванием и сбоями на экране при прокрутке вверх:

Это исключительно программная проблема? Что ещё мы можем сделать для оптимизации пользовательского опыта при прокрутке вверх?

Это происходит без рекламы?

Да, это так. Как модератор я не вижу рекламы, и прокрутка вверх всё ещё работает с ошибками.

Разумно ли сделать так, чтобы приложение не «отскакивало» назад, если пользователь слишком быстро прокручивает вверх? Я предполагаю, что проблема возникает из-за того, что пользователь прокручивает слишком быстро, и посты не успевают корректно отобразиться, как объяснялось выше. Я бы предпочёл, чтобы экран просто замораживался, а не возвращался назад после загрузки предыдущих постов, что сбивает пользователей с толку.

Также интересно, что происходит в безопасном режиме? Using Safe Mode to troubleshoot issues with themes and plugins

1 лайк

Это также происходит в безопасном режиме, @littleviolette?

1 лайк

Я только что попытался воспроизвести проблему в обычном режиме и в безопасном режиме. Мне не удалось воспроизвести проблему. Я обновил Discourse 2 дня назад — не уверен, изменило ли это какое-либо поведение. Я попрошу мое сообщество предоставить дополнительную обратную связь. Спасибо за уточнение!

4 лайка

Мы также получаем множество сообщений об этом на нашем сайте. Я только что проверил, и проблема сохраняется даже в безопасном режиме. Вот некоторые из недавних сообщений:

2 лайка
1 лайк

Мы только что исправили ошибку, из-за которой сайты с нестандартными настройками (например, «не получать размер изображений») сталкивались с проблемами при загрузке изображений, вызывающими скачок прокрутки во время их изменения размеров. Мы убрали эту настройку, так как она была поистине «выстрелом себе в ногу». Возможно, проверьте, не была ли она у вас включена.

Другой возможной причиной могут быть рекламные блоки.

В принципе, любые элементы, вызывающие динамическое изменение размера области просмотра, приводят к серьёзным проблемам.