For example, by setting stage.draggable(true)
we can make a stage draggable.
By default, it is a continuous motion, meaning that every time when the mouse exerts dragging on a stage, the drag event is invoked. This causes lagging in my application, probably because of the large amounts of shapes that need to be redrawn after each drag event.
So, is there a way to control the timing of invoking drag event? Or maybe can I set a small time gap between each drag event?
No, in Konva
you can't control timing of invoking drag event.
Konva
is updating positions and firing dragmove
event on every mousemove/touchmove
event.
But it doesn't draw immediately. It draws as soon as possible with requestAnimationFrame.
If you want to have full control over dragging you can implement it manually.
Like (1) listen to mousedown/touchstart
event, (2) move node on mousemove/touchmove
and (3) stop dragging on mouseup/touchend
.
In the best case, you need to find ways to optimizing drawing. Usually caching improve performance of drawing a lot. You can cache on dragstart
and clear cache on dragend
.
For more performance tips take a look here: https://konvajs.org/docs/performance/All_Performance_Tips.html