Gridstack.js: Resizing elements triggers window resize event repeatedly

[Metal101]

Hello,

I'm having an issue when resizing elements via dragging. The window's resize event appears to be triggered repeatedly for every mouse movement, causing some slow down in my application. I have replicated this on a gridstack demo page by logging to console on window resize.

http://gridstackjs.com/demo/responsive.html

Do you know if there is a workaround for this please?

[radiolips]

Hey, @Metal101 ! Try out lodash's debounce method.

http://jsfiddle.net/rifat/ZDPaV/

and

https://lodash.com/docs/#debounce

Let me know if there's anything more I can help with!

[ashw1984]

hi @radiolips. this solution is only ok if you are writing everything from scratch. if i have an existing application 100's of handlers on windows resize are you expecting all of these to be re-written. Ultimately the window isn't resizing so surely this event should not be triggered. Are you able to re-open this bug?

[Metal101]

@ashw1984 has directed me to this page.

https://stackoverflow.com/questions/7494378/jquery-ui-resizable-fire-window-resize-event

It's suggested you catch the element resize event and stop propagation before it bubbles up to the window event.

[radiolips]

This is a jquery-ui "bug," not a gridstack bug. We're working to move away from jquery-ui, but in the meantime, you can check event.target as the SO mentions.