我做了一个
infinite scroll directive,它对我的用例非常有用.
然而,有一个问题.
当使用鼠标滚轮滚动触发infiniteScrollAction时,在我调用的函数中进行的HTTP调用在响应中有一个非常长的异常延迟…例如,响应返回大约需要3-5秒 – 每次保证.
但是,当我使用浏览器滚动条滚动时,响应会恢复正常并且与通常的长度相同(非常快).
我可以一遍又一遍地重复这一点,并取得成功.
以下是一些GIF演示.第一个是用鼠标滚轮滚动,注意顶部的加载条是如何非常慢的,因为响应需要一段时间.第二个是滚动浏览器滚动条,快速响应.两张图片都因为隐私而裁剪和模糊：
有人可以发现指令有什么问题吗？我不明白……起初我认为它与事件循环有关,但我在每个函数调用内部调用console.log()直到HTTP调用函数,一切都发生了.
这实际上是响应需要更长的时间,这取决于我是使用鼠标滚轮还是使用浏览器滚动条滚动,这绝对是荒谬的,但它正是发生的事情.我无法弄清楚出了什么问题.但我可以证明这是事实,因为当我使用鼠标滚轮滚动时,我可以在Chrome上的网络选项卡中看到响应处于待处理状态,但是当我使用滚动条滚动时,它不会等待很长时间.
解决方法
你看过这个
Random high content download time in chrome?吗？
我正在使用ngx-infinite-scroll,我遇到了同样的问题.
所以我的解决方案(感谢上面提到的帖子)：
export class InfiniteScrollDirective {
...
@HostListener('mousewheel')
onMouseWheel() {
}
...
}
即使没有任何实现,只是纯粹的监听器已经解决了这个问题.之后没有更慢的http请求.
你能试试吗？
