prograhammer prograhammer - 27 days ago 7
jQuery Question

jQuery plugin Chosen (enhances mutliselects) works great in Chrome, but slow in Internet Explorer

I'm currently using the Chosen jQuery plugin.
Check out my fiddle here: http://jsfiddle.net/3XWSe/

Try the fiddle in both Chrome and Internet Explorer (I tested using IE version 11).

Notice there is a delay (4 or 5 seconds) when clicking on the multiselect in Internet Explorer, as compared to very little, almost none, in Chrome. This example dropdown is listing all the cities in Texas and has close to 5000 options.

I opened up chosen.jquery.js and traced the problem to this call:

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
};


I noticed that after the first click, if I stop
this.search_results.html
from updating on all subsequent clicks, the multiselect will no longer respond slowly. To fix the problem for the first click I would need to perhaps preload the content somehow. Any ideas?

Any suggestions on how to fix this performance issue for IE, or do you know of another comparable jQuery plugin that can handle these large amounts of options in IE? (I've tried select2 and some others to no avail).

EDIT: Since this question has become popular over the year, I want to let everyone know that I abandoned Chosen and now use Select2 4.0 (which has excellent performance with large data and infinite scroll). It seems built to allow developers to decorate and alter it more easily and works on mobile.

Answer Source

Since this question has become popular over the year, I want to let everyone know that I abandoned Chosen and now use Select2 4.0.

  1. It's seems to be the most widely accepted successor of Chosen.
  2. The 4.0 version has excellent performance with large data and infinite scroll.
  3. It seems built to allow developers to decorate and alter it more easily.
  4. It works on mobile (unlike Selectize).