Opened 6 years ago
Last modified 3 years ago
#15097 new bug
Sortable in 1.12.x much (min 3x) slower than 1.11.x
Reported by: | cucko | Owned by: | |
---|---|---|---|
Priority: | minor | Milestone: | none |
Component: | ui.sortable | Version: | 1.12.1 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
Here are two js fiddle examples
jq ui 1.11.4: https://jsfiddle.net/5z7fw7Lb/1/
jq ui 1.12.0: https://jsfiddle.net/5z7fw7Lb/
jq ui 1.12.1: https://jsfiddle.net/5z7fw7Lb/2/
Change History (5)
comment:1 Changed 6 years ago by
comment:3 Changed 5 years ago by
Same problem. Anyone will fix it after a year?.. 900 elements take 55sec, with 1.11.4 it takes only a few.
comment:4 Changed 4 years ago by
Same problem here. I have a small snippet to reproduce the issue:
<ul></ul> <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script> <script> var ul = jQuery('ul'); for(var i = 0; i < 2000; i++) { ul.append(jQuery('<li>List item ' + i + '</li>')); } ul.sortable({axis: 'y'}); </script>
I have found out that it is stuck when it assigns the class 'ui-sortable-handle'
to the list's items (_setHandleClassName
function).
The adding of the class takes longer for each item that has been processed.
comment:5 Changed 3 years ago by
Through benchmarking I have confirmed this to still be a MAJOR performance issue for a large sortable and it still exists in v1.12.1. I have confirmed through benchmarking the following fix to this problem in jQuery UI v1.12.1 by modifying _setHandleClassName().
Change:
$.each( this.items, function() { that._addClass( this.instance.options.handle ? this.item.find( this.instance.options.handle ) : this.item, "ui-sortable-handle" ); } );
to:
$.each( this.items, function() { (this.instance.options.handle ? this.item.find( this.instance.options.handle ) : this.item ).addClass('ui-sortable-handle'); } );
I found this solution at https://stackoverflow.com/questions/20398400/jquery-ui-sortable-call-is-slow-when-applies-to-thousands-of-elements
I can confirm this problem. I have a page with six lists and summary ~3000 items. Chrome crashes with this browser tab, but only with version jquery ui 1.12.1. Sortable in version jquery ui 1.11.4 working fast and fine as replacement.
Other source: http://stackoverflow.com/a/41624770/706420