jQuery插件Chosen（增强mutliselects）在Chrome中运行良好，但在Internet Explorer中运行缓慢

Question

我目前正在使用Chosen jQuery plugin。 看看我的小提琴：http://jsfiddle.net/3XWSe/

尝试Chrome和Internet Explorer中的小提琴（我使用IE 11测试）。

请注意，在Chrome浏览器中单击多重选项时会有一段延迟（4或5秒），而在Chrome中则非常少，几乎没有。此示例下拉列表列出了德克萨斯州的所有城市，并且有近5000个选项。

我打开 chosen.jquery.js 并将问题跟踪到此次调用：

Chosen.prototype.update_results_content = function(content) {
    return this.search_results.html(content);  //<-- Problem here when loading the large amount of HTML into the element
};

我注意到，在第一次点击后，如果我停止this.search_results.html更新所有后续点击，则多重选择将不再缓慢响应。要解决第一次单击的问题，我需要以某种方式预加载内容。有什么想法吗？

有关如何解决IE 的性能问题的任何建议，或者您是否知道可以在IE中处理这些大量选项的其他可比较的jQuery插件？ （我已经尝试了 select2 和其他一些无效的。）

编辑：由于这个问题在一年中变得很受欢迎，我想让大家知道我放弃了选择，现在使用Select2 4.0（具有出色的performance with large data and infinite scroll）。它似乎是为了让开发人员能够更容易地装饰和改变它而在移动设备上运行。

Answer 1

嗯，这里有一些天生的错误。那就是， IE 很糟糕。

即使使用 Chrome ，我的引擎上的渲染也需要 840ms 。对于 IE ，我们正在谈论 3276ms 。这主要是由于 IE 呈现 DOM 的方式。 Firefox 呈现 82ms 。

此图表示IE 10，但即使IE 11也存在重大的DOM相关问题

引用： http://www.tomshardware.com/reviews/chrome-27-firefox-21-opera-next,3534-6.html

很遗憾，您的代码没有问题......您的浏览器存在问题。

Answer 2

更深入地看，底层问题是rnoInnerhtml RegEx用于在jQuery.html()功能中查找脚本标记。在滚动大型数据集时，IE中使用的RegEx非常慢。

/<(?:script|style|link)/i

对此RegEx的性能调整可能有助于解决问题。

我还调整了Chosen Scripts和CSS，以减少发出的html的总大小，从而减少了数据量。

Answer 3

由于这个问题在一年中变得流行，我想让大家知道我放弃了选择，现在使用 Select2 4.0 。

1. 它似乎是被选中最广泛接受的接班人。
2. 4.0版has excellent performance with large data and infinite scroll。
3. 它似乎可以让开发人员更容易地装饰和改变它。
4. 适用于移动设备（与 Selectize 不同）。