Chosen vs Select2 vs DropKick vs selectBox vs SelectBoxIt vs ddSlick (v23)

Revision 23 of this benchmark created by Greg Franko on


Description

Compare Chosen, Select2, selectBox, SelectBoxIt, DropKick, and ddSlick for lists with large number of items. Updated the test to have a fair test for all plugins. Earlier test had a different data for ddslick i.e. included images.

Preparation HTML

<link href="//raw.github.com/harvesthq/chosen/master/chosen/chosen.css" rel="stylesheet"
/>
<link href="//raw.github.com/ivaynberg/select2/master/select2.css" rel="stylesheet"
/>
<link href="//raw.github.com/JamieLottering/DropKick/master/dropkick.css" rel="stylesheet"
/>
<link href="//raw.github.com/claviska/jquery-selectBox/master/jquery.selectBox.css"
rel="stylesheet" />
<link href="//raw.github.com/gfranko/jquery.selectBoxIt.js/master/src/stylesheets/SelectBoxIt/jquery.selectBoxIt.css"
rel="stylesheet" />
<div id="container">
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/jquery-ui.min.js">
</script>
<script src="//raw.github.com/harvesthq/chosen/master/chosen/chosen.jquery.min.js">
</script>
<script src="//raw.github.com/ivaynberg/select2/master/select2.js">
</script>
<script src="//raw.github.com/JamieLottering/DropKick/master/jquery.dropkick-1.0.0.js">
</script>
<script src="//raw.github.com/claviska/jquery-selectBox/master/jquery.selectBox.min.js">
</script>
<script src="http://gregfranko.com/jquery.selectBoxIt.js/js/jquery.selectBoxIt.min.js">
</script>
<script src="http://dl.dropbox.com/u/40036711/Scripts/jquery.ddslick.min.js">
</script>

Setup

select = $('<select></select>').appendTo("#container");
    var i, length = 600;
    for (i = 0; i < length; i++) {
      select.append('<option value="' + i + '">' + i + '</option>');
    }

Teardown


    select.remove();
    $("#container").empty();
  

Test runner

Ready to run.

Testing in
TestOps/sec
Chosen
select.chosen();
ready
Select2
select.select2();
ready
DropKick
select.dropkick();
ready
selectBox
select.selectBox();
ready
ddSlick
select.ddslick();
ready
SelectBoxIt
select.selectBoxIt();
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.

  • Revision 2: published by Henrik Pettersson on
  • Revision 3: published by Carney on
  • Revision 4: published by Carney on
  • Revision 5: published by Carney on
  • Revision 6: published by Carney on
  • Revision 7: published by Carney on
  • Revision 8: published by Carney on
  • Revision 9: published by Carney on
  • Revision 10: published by Carney on
  • Revision 11: published by Carney on
  • Revision 12: published by Carney on
  • Revision 13: published by Carney on
  • Revision 14: published by Carney on
  • Revision 15: published on
  • Revision 16: published by Greg Franko on
  • Revision 21: published on
  • Revision 23: published by Greg Franko on
  • Revision 28: published on