1

Javascriptでは、mousemoveイベントハンドラーで、キューに保留中のmousemoveイベントがあるかどうかを判断できますか?

または、できれば、最新のイベントを除く、キュー内のすべてのmousemoveイベントをイベントキューにスキップさせることは可能ですか?

私はmousemoveと他のマウスイベントを使用して、ユーザーが画面上で要素をドラッグできるようにしています。すべてのmousemoveイベントでドラッグされたアイテムを再描画するCPUとGPUサイクルを無駄にする必要はありません(上部と左側のCSSプロパティを更新します) )、中間イベントを十分に迅速にスキップできる限り。

私のサイトでは現在、パフォーマンスや視覚化の問題は発生していません。JavaScriptをできるだけ効率的にしたいだけです。

4

2 に答える 2

1

イベントデバウンスを使用します。この小さなスロットル/デバウンスライブラリは、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);
于 2013-02-19T00:18:27.870 に答える
0

前回マウスムーブを処理した時間を追跡し、早すぎる場合は現在のマウスムーブをスキップすることができます。

例えば:

elem.onmousemove = function() {
    var lastcalled = arguments.callee.lastCallTime || 0,
        now = new Date().getTime();
    if( now-lastcalled < 250) return;
    arguments.callee.lastCallTime = now;
    // rest of code here
};
于 2013-02-19T00:19:28.527 に答える