由于主线程正忙，Angular2 对“鼠标滚轮”输入事件的处理延迟了 x 毫秒
Posted
技术标签:
【中文标题】由于主线程正忙，Angular2 对“鼠标滚轮”输入事件的处理延迟了 x 毫秒【英文标题】：Angular2 Handling of 'mouse wheel' input event was delayed for x ms due to main thread being busy 【发布时间】：2016-10-12 08:07:42 【问题描述】：我将 Angular2 (r.2.0.0) 与 typescript (v.1.8.10) 一起使用。在工作滚动时，Chrome 什么也不做并发出警告（由于主线程忙，“鼠标滚轮”输入事件的处理延迟了 236 毫秒。考虑将事件处理程序标记为“被动”以使页面更具响应性。）
我正在使用 websocket 消息，滚动时无法触发接收到的消息。滚动作业完成后，所有收到的消息都开始处理。 我发现了类似的问题here，但它并没有解决我的问题。
html代码：
<canvas id="ReferenceLineCanvasName" (mousewheel)="OnMouseWheel($event)" (dblclick)="OnMouseDoubleCliked()" (mouseout)="OnMouseUp($event)" (mousedown)="OnMouseDown($event)" (mouseup)="OnMouseUp($event)" (mousemove)="OnMouseMove($event)" class="reference_canvas_class"></canvas>
ts 代码：
public OnMouseWheel(event: any): any ...send message to server with websocket...
public SocketMessageReceived(stream: any): any .. not working while scrolling ...
【问题讨论】：
【参考方案1】：您可以将所有 websocket 交互委托给 webworker，然后使用 rxjs 订阅 webworker 事件。 Web Worker 可以在接收和处理数据后发出事件信号。
服务可以包装此功能，根据请求返回 Observable 方法。
onMouseWell 也可以像这样包裹在 Observable 中：angular2 rxjs event handling
【讨论】：
以上是关于由于主线程正忙，Angular2 对“鼠标滚轮”输入事件的处理延迟了 x 毫秒的主要内容，如果未能解决你的问题，请参考以下文章