Ticket #5886 (closed bug: duplicate)

Opened 4 years ago

Last modified 2 years ago

connectWith performance problem with Sortable

Reported by: matdumsa Owned by:
Priority: major Milestone:
Component: ui.sortable Version: 1.8.2
Keywords: connectWith, performance, slow, issue Cc:
Blocking: Blocked by:

Description

We broke down the time it took to generate one of the huge javascript demanding page on our site and realized that all that javascript binding was taking much of the time. Out of that time, the vast majority of the time was spent applying .sortable() to enable drag&dropping of all elements.. It turns out that time is vastly reduced if we removed the connectWith option, but then user cannot drag&drop items from an iteration container to another..

By playing with this today I realized that we can save a lot of processing and time by setting the connectWith option AFTER the .sortable() is initialized!!

Before:

$(container).sortable({ distance: 5, axis:"y", "connectWith", '#story>.iteration_frame>.iteration_container.allowdrop' cancel: 'div.disabled,div.opened,div.plan_table_message' })

After:

$(container).sortable({ distance: 5, axis:"y", cancel: 'div.disabled,div.opened,div.plan_table_message' }).sortable( "option", "connectWith", '#story>.iteration_frame>.iteration_container.allowdrop' ); For whatever reason setting this option AFTER initialization saves us 4X the time!!

The bottom line?

Plan, large page, all initiatives all items everybody, Time to do JS bindings (browser is blocked for that time so it's a time user feels!) Before: 16 935ms, 253437 calls After: 5 617ms, 179336 calls

Work page, same selection Before: 1200ms, 136 668 calls After: 510ms, 39565 calls

The more sortable elements on the page the bigger the benefit!

You can look at that page on the forums:  http://forum.jquery.com/topic/interesting-bits-for-anyone-using-ui-sortable-with-the-connectingwith-option

  • Mathieu

Change History

comment:1 Changed 3 years ago by jdmarshall

Duplicate of #4759

comment:2 Changed 3 years ago by scott.gonzalez

  • Status changed from new to closed
  • Resolution set to duplicate

comment:3 Changed 2 years ago by scott.gonzalez

  • Milestone TBD deleted

Milestone TBD deleted

Note: See TracTickets for help on using tickets.