Quali sono le differenze tra Chosen e Select2?

Chosen e Select2 sono le due librerie più popolari per estendere i box di selezione.

Entrambi sembrano essere attivamente mantenuti, Chosen è più vecchio e supporta sia jQuery che Prototype.

Select2 è solo jQuery, la sua documentazione afferma che Select2 è ispirato a Chosen, ma non specifica in dettaglio eventuali miglioramenti apportati (se presenti) o altri motivi per la riscrittura.

Due librerie hanno praticamente lo stesso set di funzionalità, l'unico confronto che ho trovato è una pagina di test jsperf piuttosto inconcludente.

Qualcuna di queste librerie ha dei vantaggi rispetto alle altre?

A partire da Select2 3.3.1, di seguito è riportato ciò che è documentato in README.md

Che cosa non supporta Select2 scelto?

• Lavorare con set di dati di grandi dimensioni: Chosen richiede che l'intero set di dati sia caricato come optiontag nel DOM, il che lo limita a lavorare con set di dati di piccole dimensioni. Select2 utilizza una funzione per trovare i risultati al volo, che consente di caricare parzialmente i risultati.
• Paging dei risultati: poiché Select2 funziona con set di dati di grandi dimensioni e carica solo una piccola quantità di risultati corrispondenti alla volta, deve supportare il paging. Select2 chiamerà la funzione di ricerca quando l'utente scorre fino alla fine del set di risultati attualmente caricato consentendo lo "scorrimento infinito" dei risultati.
• Markup personalizzato per i risultati: Chosen supporta solo il rendering dei risultati di testo perché è l'unico markup supportato dai optiontag. Select2 fornisce un punto di estensione che può essere utilizzato per produrre qualsiasi tipo di markup per rappresentare i risultati.
• Possibilità di aggiungere risultati al volo: Select2 offre la possibilità di aggiungere risultati dal termine di ricerca inserito dall'utente, che consente di utilizzarlo per la codifica.

L'IMHO scelto è "mantenuto" ma non "mantenuto attivamente". 341 edizioni e 51 richieste pull per Chosen. Select2 ha 128 numeri e 25 richieste pull. Penso che il modello per questi sia fondamentalmente

• scegli quello che è superficialmente più attraente per te
• usalo in un'app o due
• imbattersi in problemi di personalizzazione o limitazioni
• forse prova a lavorare con la community tramite problemi e richieste pull
• alla fine ti stufi e costruisci il tuo usando ciò che hai imparato in questo processo

Qualunque sia la tua scelta, se il tuo caso d'uso è esattamente nel loro punto debole, uno funzionerà. In caso contrario, dovrai eventualmente scrivere il tuo o personalizzarlo pesantemente. In entrambi i casi, la scelta di quale specificamente non è poi così importante. Immagino che mi schierò con @Andy Ray e @paul qui che Select2 è probabilmente la scelta iniziale migliore.

Un'altra differenza degna di nota è che Chosenè sviluppata in Sasse CoffeeScriptmentre Select2è semplice CSSe JS. È una mia opzione personale quella Sasse CoffeeScriptsono livelli di complessità non necessari che rendono difficile il debug.

Dopo aver provato entrambi, non ho deciso di usare nessuno dei due: cercare di Select2creare funzionalità degli oggetti risulta essere un affare molto peloso in quanto semplicemente non puoi farlo se collegato a <select>elementi - semplicemente non mi sento ben pensato ai cerchi che avrei avuto saltare attraverso.

Ho deciso di usare selectize.js che aggiunge semplicemente il nuovo <option>...</option>elemento al DOM del form - e questo è sano. Utilizza anche LESS- ma vorrei ignorarlo e adattare il compilato CSSdirettamente nel tuo progetto.

chosen.js vs select2.js

• Licenza MIT per entrambi
• dipendenze:
  • Select2: jQuery
  • Scelto: da confermare
• Supporto per browser desktop:
  • Seleziona2: IE8 +
  • Scelto: IE8 +
• Supporto dispositivo:
  • Select2: poco chiaro
  • Scelto: disabilitato su iPhone, iPod Touch e dispositivi mobili Android
• Peso (minimizzato):
  • Seleziona2: 57KB
  • Scelto: 27 KB
• Utilizzo: Select2 supporta un'interfaccia utente più "elaborata" (vedere "modelli")
• Entrambi i repository di codice sono disponibili su Github
  • Select2: contributi: molto attivo
  • Scelto: contributi: circa 3 volte meno di Select2

ps. Cercherò di aggiornare questa risposta quando scoprirò di più sui punti mancanti

Prima di tutto, lascia che ti dica che Chosen e Select2 sono due fantastici plugin e questa è la mia esperienza personale su Chosen. Tutto ciò che stanno dicendo è vero per quanto riguarda gli eletti.

Il problema sollevato da Pēteris Caune con il selectbambino ha 2 anni e non esiste ancora una soluzione ufficiale. Semplicemente non esiste una buona documentazione per l'API. È stato sottolineato (guarda il numero 671) molte volte ma non c'è ancora nulla. Ci sono voluti quasi 2 anni per risolvere questo problema in cui la scelta non avrebbe funzionato se avessi nascosto il div overflow:hiddenprima di mostrarlo (e devi usare witdh:X%un'opzione che in pratica non sapresti mai se non cerchi il problema).

Direi che il problema principale è la velocità di correzione come diceva DelvarWorld nel numero 92:

La mia richiesta pull risolve questo problema, ma come il mio altro e molti di quelli scelti, vengono ignorati. Questo progetto ha troppi collaboratori con una base di codice troppo piccola.

Ho scelto Chosen per la sua licenza MIT ma avevo tutti questi problemi (taglio a discesa, non trovare l'API, ricerca di ore per l'overflow nascosto), quindi ho deciso di passare a select2 perché ha una documentazione migliore, nessun bug per il taglio a discesa e correzioni più veloci.

Una caratteristica che funziona in Select2 ma non funziona in Chosen, è selectall'interno dell'elemento che ha overflow: hiddeno overflow: auto.

Problema corrispondente per il prescelto: https://github.com/harvesthq/chosen/issues/86

Alcune differenze che ho riscontrato lavorando con questi due plugin:

• Con select2 è possibile cercare in qualsiasi posizione nell'opzione. Ad esempio, se si dispone di un'opzione chiamata ABCDEFG e si digita CDE, si otterrà tale opzione nei risultati della ricerca, ma con la scelta è necessario digitare AB .. e così via per ottenere i risultati.

• Ho scoperto che con set di dati più grandi, scelto sembra essere più veloce di select2, specialmente in IE.

Select2 supporta i dispositivi mobili, mentre Chosen si disabilita specificamente su iPod, iPhone e dispositivi mobili Android. Se si desidera utilizzare caselle di selezione "estese" su dispositivi mobili, ciò semplifica la scelta.

La mia esperienza con Select2 è stata fantastica sul desktop, ma sui dispositivi mobili touch è stata molto varia, con alcune stranezze sempre presenti. Ad esempio, su xperia st15i con ics e il menu a discesa del browser stock si chiudeva sempre a causa del furto della tastiera. L'unico modo per riaprirlo è toccare il menu decine di volte, tenere il dito per un secondo e altra magia voodoo. O iniziare a digitare mentre l'elenco a discesa è chiuso e quanti utenti lo scopriranno?

Selectize.js sembra essere molto più fluido di Select2, ma ha anche problemi da solo su dispositivi mobili, ad esempio quando il valore è selezionato o immesso sposta la pagina completamente a sinistra per qualche motivo. Inoltre, sui vecchi dispositivi Android 2.x che non supportano l'overflow, è impossibile selezionare oltre le poche opzioni principali, poiché la tastiera non si apre. :(

Devo ancora provare Chosen e potrebbe non essere una cattiva idea essere disabilitato per i dispositivi mobili dopo tutto, ma alla fine un buon vecchio menu a discesa funziona sempre e ovunque.

Aggiornamento: ora ho anche testato anche Chosen, ed è meglio in una sola area: non funziona sui dispositivi mobili per impostazione predefinita (fantastico!), Ma ha problemi di filtraggio delle parole. Ad esempio, non cerca nel mezzo delle parole e se usi & nbsp hack per gli allarmi, ignorerà anche le opzioni complete. Torna al tavolo da disegno.

Perché ho scelto select2 su Scelto

La caratteristica chiave che select2 ha, che nessun altro controllo ha auto-magicamente, è la selezione "Cancella tutto" con la "x" nella mano destra del controllo. Questa è una funzione killer per la mia applicazione. Non so perché altre librerie di miglioramento dei tag selezionati non abbiano questa funzione.

Select2 supporta AJAX scelto

Select 2 ha dimensioni leggermente più pesanti rispetto a quelle scelte.

Sono passato a Select2 perché nessun supporto ufficiale per le operazioni Ajax.