当应用于数千个元素时，jQuery UI .sortable() 调用速度很慢

Question

我的问题基本上是这样的 - Applying jQuery UI Sortable to hundreds of elements on a page results in very slow page load -- need ideas on how to make it more efficient但由于所有答案都没有解决我的问题，所以我再次问这个问题。

对 300 个元素 ( http://jsfiddle.net/LcgEL/ ) 应用 .sortable() 大约需要 60 毫秒。将其应用于数千个元素会导致时间接近 250 毫秒。这会带来非常明显的延迟，影响用户体验，因为应用程序看起来很滞后。

有什么办法可以加快速度吗？谢谢!

JSFiddle link for the code - http://jsfiddle.net/LcgEL/

Answer 1

如果有人因为像我一样升级到 1.12.1 并遇到性能问题而偶然发现此页面:不要回滚到 1.11.4，而是在可排序小部件中找到 _setHandleClassName 函数(在我的自定义下载中，在 jquery-ui.js 中的第 #5300 行附近)并进行更改:

$.each( this.items, function() {
    that._addClass(
        this.instance.options.handle ?
        this.item.find( this.instance.options.handle ) :
        this.item,
        "ui-sortable-handle"
    );
});

致:

$.each( this.items, function() {
    (this.instance.options.handle 
     ? this.item.find( this.instance.options.handle ) 
     : this.item
    ).addClass('ui-sortable-handle');
});

就像之前的版本一样。

就我而言，这将 700 个项目的可排序列表的初始化速度从约 20 秒缩短到几毫秒。 o_O

请注意:虽然我在页面上使用此方法时尚未发现任何问题，但由于时间不够，尚未对其进行彻底测试。