Подтвердить что ты не робот

XHR/setTimeout/Promise не заканчивается до тех пор, пока в Chrome не закроется прокрутка

В Chrome, если пользователь прокручивает все XHR, а setTimeouts будет задерживаться до тех пор, пока прокрутка не остановится, и мне понадобится обходной путь для этого. Поведение описано в этом сообщении в блоге. Хотя эта функция помогает передвигать прокрутку, она катастрофична для бесконечного прокрутки, и это то, что я пытаюсь сделать.

Доказательства того, что это происходит:

  • Все остальные браузеры работают нормально, Chrome показывает пустой экран, пока пользователь не перестанет прокручиваться.

  • Сетевая панель отобразит все запросы как pending до тех пор, пока прокрутка не закончится, а затем все закончится сразу.

  • Поместите это в фрагмент, запустите его, затем сразу начните прокрутку. SetTimeout не будет вызываться до тех пор, пока не закончится прокрутка.

var p = new Promise(function (resolve) {
    setTimeout(function () {
        console.log('resolving');
        resolve();
    }, 1000)
});

p.then(function () {
    console.log('DONE!!');
})
4b9b3361

Ответ 1

В зависимости от вашего точного сценария и желаемой поддержки браузера, я бы попробовал Service Workers - которые предназначены для таких задач, как тот, который вы (и может перехватить весь трафик), или веб-работник в сделать свой AJAX в фоновом режиме.

Ответ 2

Поскольку это связано с движком, я не думаю, что обходной путь возможен. Вместо этого я отправил отчет об ошибке в команду Chrome.

https://bugs.chromium.org/p/chromium/issues/detail?id=661155

Ответ 3

Я считаю, что это может быть связано с этой функцией Chrome:

https://www.chromestatus.com/feature/5745543795965952 (прослушиватели пассивных событий)

Chrome пытается избежать работы на мобильном телефоне, когда пользователь прокручивается, поэтому прослушивание событий touchmove иногда может задерживать обработчики и тайм-ауты от стрельбы.

Демо:
https://rbyers.github.io/scroll-latency.html
(проверьте Handler Jank и прокрутите страницу)