私はキネティックでウェブアプリを開発しています。私は異なる「ビュー」を持っています 各ビューにはいくつかのレイヤーが含まれています。各レイヤーは画像/グループ/形状を保持しますが、ほとんどは画像です。
ビューを表示するとき、他のビューは (明らかに) 非表示になり、表示されるビューは構築されます (画像が作成され、割り当てられたレイヤーに追加されます)。 -アプリ
+見る
| + レイヤー
| | | + シェイプ
| | | + ..
| + レイヤー
| + ...
...
プロジェクトが大きくなるにつれて、ビューを切り替えるときにラグが発生することに気付きました。それで私の検索が始まりました...
「画像が多いとキャンバスのラグが発生するのではないか」と思ったので、キャンバス上にある必要のない画像をDOM(div with background)に配置した画像に差し替えました。
どちらの方法でも、200ms の遅延を引き起こす moueUp イベントがあります。動的なコードへの参照は、このメソッドを指しています。
Kinetic.DD._endDrag = function (evt){ ... }
ビューの変更を引き起こすクリックされたオブジェクトにドラッグ イベントは設定されません。
フル キネティック テスト ケースを見てみると、別のイベントがあります。300ミリ秒のラグを引き起こすmouseMove!kintec のコードへの参照は、この部分を示しています。
that.content.addEventListener
inside
_bindContentEvents: function ()
とコメントしました:
/**
* begin listening for events by adding event handlers
* to the container
*/
これらの関数の中で何が起こるでしょうか? 何もない、ただのアイドルです... これは、ビューを変更したときにプロファイルを作成することによって証明されます。CPU 時間の 95% がアイドル状態に費やされています...
立ち往生している このラグを取り除くにはどうすればよいですか? (そしてこれはデスクトップ上であり、モバイルデバイス(タブ)でも実行する必要があります!!