Skip to content

Commit

Permalink
Improve performance of large option lists
Browse files Browse the repository at this point in the history
I've noticed large option lists in selects cause the browser to timeout when rendering selectize.
Detaching the input, then detaching the children from it,
then re-attaching the input dramatically improves performance.

[skip-ci]
  • Loading branch information
StefanH authored and joallard committed Jul 20, 2016
1 parent 0bd5c80 commit 6429304
Showing 1 changed file with 6 additions and 1 deletion.
7 changes: 6 additions & 1 deletion src/selectize.js
Original file line number Diff line number Diff line change
Expand Up @@ -225,8 +225,13 @@ $.extend(Selectize.prototype, {

// store original children and tab index so that they can be
// restored when the destroy() method is called.
// Detach children outside of DOM to prevent slowdown on large selects
var inputPlaceholder = $('<div></div>');
$input.replaceWith(inputPlaceholder);
var inputChildren = $input.children().detach();
inputPlaceholder.replaceWith($input);
this.revertSettings = {
$children : $input.children().detach(),
$children : inputChildren,
tabindex : $input.attr('tabindex')
};

Expand Down

0 comments on commit 6429304

Please sign in to comment.