Ci sono dei favolosi plugin per jQuery. I migliori sono quelli adottati da migliaia di sviluppatori web in tutto il mondo. Fortunatamente, i peggiori falliscono e scompaiono nell’oscurità. Ecco alcuni suggerimenti per garantire ai tuoi plugin di raggiungere la loro piena potenzialità…
10 suggerimenti

⤽
1. Non spezzare la catena
⤽
A meno che il tuo plugin restituisca un valore, l’ultima riga della funzione plug-in deve essere:
Copia codice 

/* */
return this;
/* */
questo assicura la concatenazione tra le chiamate ai metodi, ad esempio:
Copia codice 

/* */
$("div#mioId").tuoPlugin().suoPlugin().altroPlugin();
/* */
2. Renderlo facile da usare
⤽
Nella maggior parte dei casi, il plugin dovrebbero semplicemente funzionare senza che lo sviluppatore debba guardare anche la documentazione, impostare le opzioni o modificare il codice del plugin.
Se si tratta di un widget visuale, lo sviluppatore non dovrebbe avere bisogno di modificare il codice JavaScript. Si può semplicemente fornire dell’HTML con una classe o id che lancerà automaticamente il codice, ad esempio:
Copia codice 

/* */
<section class="mioWidget">
Mio contenuto
</section>
/* */
Il plugin che può inizializzarsi da sé, ad esempio:
Copia codice 

/* */
$(function() {
   $("section.mioWidget").mioWidget();
});
/* */
3. Utilizzare un adeguato Naming e i numeri di controllo della versione
⤽
Ci sono un sacco di plugin in jQuery. Se stai pensando di dare un nome alla “scheda” per gestirla con un plugin, c’è una forte possibilità che sia già stato usato. Questo potrebbe non sempre importare, ma evitare l’uso di nomi che sono ambigui o suscettibili di scontri.
La numerazione della versione è anche utile. è diventata particolarmente importante quando gli sviluppatori vogliono segnalare dei problemi.
4. Utilizzare le chiusure
⤽
Non dipendere mai dal riferimento ‘$’ di jQuery. Se lo sviluppatore ha un’altra libreria installata, può fare presa su questa prima che jQuery che sia stata caricata. Il modo più semplice per risolvere il problema è quello di passare ‘$’ come argomento il in una funzione anonima di auto-avviamento di jQuery, ad esempio:
Copia codice 

/* */
(function($) {
	// qui il codice può utilizzare $
	// come riferimento a jQuery
})(jQuery);
/* */
5. Impostare i parametri predefiniti
⤽
La maggior parte dei plugins impostano i parametri utilizzando la notazione json (acronimo di JavaScript Object Notation), ad esempio:
Copia codice 

/* */
$("#select").mioPlugin({opt1: 1, opt2: 2, opt3: "tre"});
/* */
Questo ha diversi vantaggi: i parametri sono facili da leggere, possono essere ordinati in qualunque maniera od omessi completamente.
Tuttavia, è necessario impostare i valori predefiniti all’interno del codice del plugin ed eseguire l’override di conseguenza, ad esempio:
Copia codice 

/* */
$.fn.mioPlugin = function(opts) {
	// configurazione di default
	var config = $.extend({}, {
		opt1: 1,
		opt2: 2,
		opt3: 3,
		opt4: 4,
		opt5: 5
	}, opts);
/* */
Il tuo plugin può quindi fare riferimento a parametri utilizzando un codice come config.opt1.
6. Supporto di parametri HTML
⤽
Idealmente, i widgets HTML dovrebbero essere in grado di impostare i parametri senza che lo sviluppatore debba modificare il codice JavaScript Si potrebbe prendere in considerazione gli attributi di dati HTML5, per esempio:
Copia codice 

/* */
<section class="mioWidget" data-opt1="1" data-opt2="two">
Mio contenuto
</section>
/* */
Questi possono essere accessibili tramite metodo data di jQuery: .data("opt1").
7. Documentare il codice
⤽
Aggiungere commenti concisi nella parte superiore del vostro plugin che descrivono:

  • il nome del plugin e la sua versione;
  • cosa fa il plugin;
  • esempi d’uso;
  • i parametri;
  • collegamenti per contatto e supporto.

S’è particolarmente complesso, si consideri un file readme separato.

8. Testare il plugin accuratamente
⤽
Provatelo. Poi provatelo di nuovo in tutti i browser.
Ci possono essere dei problemi che non siete disposti a risolvere, ad esempio i problemi di compatibilità con IE6. Va bene, ma assicuratevi che sia menzionato nella documentazione.
9. Utilizzare un buon modello
⤽
Ecco il codice del modello che uso quando creo un nuovo plugin:
Copia codice 

/*!
 * jQuery plugin
 * Che cosa fa
 */
(function($) {
	$.fn.NomePlugIn = function(opts) {
		// configurazione di default
		var config = $.extend({}, {
			opt1: null
		}, opts);
		// funzione principale
		function faQualcosa(e) {
		}
		// inizializza ogni elemento
		this.each(function() {
			faQualcosa($(this));
		});
		return this;
	};
	// partenza
	$(function() {
		$("#select").NomePlugIn();
	});
})(jQuery);
/* */
Questo modello fornisce un buon punto di partenza per:

  • avvolgere il plugin in una chiusura;
  • definire le opzioni di default che saranno sovrascitte dai parametri del plugin;
  • passare ogni elemento selezionato alla funzione faQualcosa come oggetto jQuery;
  • restituire this;
  • e il codice per l’auto-avvio ch’è fornito alla fine.
10. Prendi la parola
⤽
Se desideri che gli sviluppatori utilizzino il tuo plugin, caricarlo nei repositori come GitHub, Google Code e nella directory dei plugin di jQuery. Creare pagine per la dimostrazione, pubblicizzalo in articoli e tweettalo incessantemente.
Quindi essere pronti a sostenere il plugin e aggiornarlo quando è necessario. Riceverai domande stupide e bizzarre richieste di nuove funzioni, ma tutto questo fa parte per essere un autore di plugin di successo.