Chromeでのランダムなハイコンテンツのダウンロード時間？

Are you by chance trying to implement infinite scrolling? If you are, try dragging the scroll bar instead of using the mouse wheel. For some reason, Chrome seems to struggle with mouse scroll events. If the scroll bar worked just fine, keep reading.

This post provides a detailed walkthrough of someone experiencing something similar - https://github.com/TryGhost/Ghost/issues/7934

I had attached a watcher on the scroll event which would trigger an AJAX request. I had throttled the request and could see that only 1 was being sent. I watched my dev server return the response within a few ms but there would be a 2 second delay in chrome. No render, no api calls, no and scripts executing. But the "Content Download" would take 3 seconds for 14kb. No other browser had this issue.

I stumbled upon suggestions that using requestAnimationFrame instead of setTimeout would solve the problem. That approach seems that approach works when the "Waiting" or green is significant, not so much for the "Content Download" or blue.

After hours of digging, I tried conditionally calling e.preventDefault() on the mousewheel event and to my amazement, it worked.

A few things to note:

1) I did not use the mousewheel event to make the api call. I used the scroll event along with throttling.

2) The mousewheel event is non-standard and should not be used. See https://developer.mozilla.org/en-US/docs/Web/Events/mousewheel

3) BUT in this case, you have to watch and handle the mousewheel event because of chrome. Other browsers ignore the event if they don't support it and I have yet to see it cause an issue in another browser.

4）preventDefault()マウスでのスクロールが無効になるため、毎回呼び出す必要はありません:)deltaY垂直スクロールを使用している場合は、が1の場合にのみ呼び出します。添付の画像から、deltaY基本的にスクロールできなくなったときに1であることがわかります。mousewheelページをスクロールできない場合でも、イベントが発生します。注意点として、deltaXある-0あなたが垂直方向にスクロールしているときdeltaYである-0水平にスクロールしたとき。

私の解決策：

window.addEventListener("mousewheel", (e) => {
    if (e.deltaY === 1) {
        e.preventDefault();
    }
})

それは私が仕事を見た唯一の解決策であり、他の場所で言及されたり議論されたりしたことはありません。それがお役に立てば幸いです。

マウスホイールイベントのコンソールログ