Javascript 鼠标移动事件队列

Question

在 Javascript 中，是否可以在 mousemove 事件处理程序中确定队列中是否有任何待处理的 mousemove 事件？

或者，最好是否可以使事件队列跳过队列中除最近事件之外的所有鼠标移动事件？

我使用 mousemove 和其他鼠标事件来允许用户在屏幕上拖动元素，并且我不需要浪费 CPU 和 GPU 周期在每个 mousemove 事件上重新绘制拖动的项目(其中我更新顶部和左CSS属性)，只要我能足够快地跳过中间事件。

我的网站目前没有遇到任何性能或可视化问题；我只是想让我的 JavaScript 尽可能高效。

Answer 1

使用事件去抖动。 This small throttle/debounce library无论有没有 jQuery，都可以很好地工作。

示例:

function someCallback() {
    // snip
}

// don't fire more than 10 times per second
var debouncedCallback = Cowboy.debounce(100, someCallback);
document.getElementById('some-id').addEventListener('mousemove', debouncedCallback);