I am using angular-gridster as part of a Dashboard solution. I discovered that certain movements are causing a significant performance problem that I believe can be avoided.
Problem Statement
When dragging a gridsterItem, it is possible for a lot of unnecessary processing to be triggered that will result in no change to the gridster layout. This can occur because the movements may be countered by the floating logic.
Animation
In the following animation, notice how fast the animation can be, followed by a significant performance reduction when gridster calls moveOverlappingItems to items that then floatItemUp back up:
If the framework could determine that the dragging item is not introducing a substantive change, due to the float behavior, then it could avoid all of the unnecessary processing.
Overview
I am using angular-gridster as part of a Dashboard solution. I discovered that certain movements are causing a significant performance problem that I believe can be avoided.
Problem Statement
When dragging a gridsterItem, it is possible for a lot of unnecessary processing to be triggered that will result in no change to the gridster layout. This can occur because the movements may be countered by the floating logic.
Animation
In the following animation, notice how fast the animation can be, followed by a significant performance reduction when gridster calls moveOverlappingItems to items that then floatItemUp back up:
Chrome Profiler
572.4 ms8.47 % 572.4 ms8.47 % getItems 326.4 ms4.83 % 326.4 ms4.83 % floatItemUpRow 326.4 ms4.83 % 326.4 ms4.83 % moveOverlappingItems 165.7 ms2.45 % 165.7 ms2.45 % putItem 131.7 ms1.95 % 131.7 ms1.95 % moveItemDown 131.7 ms1.95 % 131.7 ms1.95 % moveItemsDown 131.7 ms1.95 % 131.7 ms1.95 % moveOverlappingItems 114.8 ms1.70 % 114.8 ms1.70 % moveItemDown 114.8 ms1.70 % 114.8 ms1.70 % moveItemsDown 114.8 ms1.70 % 114.8 ms1.70 % moveOverlappingItems 114.8 ms1.70 % 114.8 ms1.70 % putItem 114.8 ms1.70 % 114.8 ms1.70 % setPosition 114.8 ms1.70 % 114.8 ms1.70 % positionChanged 114.8 ms1.70 % 114.8 ms1.70 % $digest 114.8 ms1.70 % 114.8 ms1.70 % $apply 114.8 ms1.70 % 114.8 ms1.70 % drag 114.8 ms1.70 % 114.8 ms1.70 % mouseMove 114.8 ms1.70 % 114.8 ms1.70 % doEvent
Thoughts
If the framework could determine that the dragging item is not introducing a substantive change, due to the float behavior, then it could avoid all of the unnecessary processing.