What are the differences between Chosen and Select2?

Paul picture Paul · Nov 27, 2012 · Viewed 54.7k times · Source

Chosen and Select2 are the two more popular libraries for extending selectboxes.

Both seem to be actively maintained, Chosen is older and supports both jQuery and Prototype.

Select2 is jQuery only, its documentation says Select2 is inspired by Chosen, but doesn't detail any improvements made (if any) or other reasons for the rewrite.

Two libraries have pretty much same feature set, the only comparison I've found is a somewhat inconclusive jsperf test page.

Does any of these libraries have any advantages over the other?

Answer

Mr. 14 picture Mr. 14 · Mar 4, 2013

As of Select2 3.3.1, below are what's documented in its README.md

What Does Select2 Support That Chosen Does Not?

  • Working with large datasets: Chosen requires the entire dataset to be loaded as option tags in the DOM, which limits it to working with small-ish datasets. Select2 uses a function to find results on-the-fly, which allows it to partially load results.
  • Paging of results: Since Select2 works with large datasets and only loads a small amount of matching results at a time it has to support paging. Select2 will call the search function when the user scrolls to the bottom of currently loaded result set allowing for the 'infinite scrolling' of results.
  • Custom markup for results: Chosen only supports rendering text results because that is the only markup supported by option tags. Select2 provides an extension point which can be used to produce any kind of markup to represent results.
  • Ability to add results on the fly: Select2 provides the ability to add results from the search term entered by the user, which allows it to be used for tagging.