Quando la pigrizia è cosa buona e giusta

Secondo Larry Wall, autore del linguaggio Perl, una delle tre grandi virtù di un buon programmatore è la pigrizia, come ha scritto nel suo libro, Programming Perl, 2nd Edition, O'Reilly.

E' la pigrizia che spinge un programmatore a non reinventare ogni volta la ruota e a cercare soluzioni brillanti che non facciano sprecare troppe energie :)

Se siete d'accordo su quanto scritto da Larry, allora siete come me: prima di buttarvi a capofitto a scrivere codice per risolvere un problema, provate a vedere se, per caso, qualcuno non lo ha già fatto prima di voi.

Scriverò dunque una serie di post dove mostrerò come utilizzare librerie javascript esterne, librerie che ritendo utili per il lavoro quotidiano di un programmatore web.

Usare una libreria esterna significa semplicemente utilizzare un modulo che la libreria mette a disposizione nello scope global, un concetto che dovrebbe esser chiaro dai post precedenti.

Quindi noi siamo utilizzatori di un modulo scritto da altri.

Come facciamo a rendere disponibile il modulo e relative funzionalità nel nostro codice?

 <script src="modulo.js"></script>  

Basta aggiungere il riferimento al file javascript che contiene la definizione del modulo, subito dopo possiamo aggiungere il nostro file che puo' utilizzare il modulo precedente perchè caricato prima in memoria dall'interprete javascript.

 <script src="modulo.js"></script>  
 <script src="nostromodulo.js"></script>  

Anche se, storicamente, tali riferimenti venivano messi nel nodo head della pagina html, oggi si preferisce metterli prima del nodo di chiusura del body, in modo da dare l'opportunità al browser di caricare subito in memoria e visualizzare la pagina immediatamente, evitando attese specialmente se i file js sono voluminosi.

Come primo esempio di libreria esterna, voglio presentarvi toastr, per capire a cosa serva, guardate questa demo: inserite un titolo, un messaggio, giocate con qualche parametro di configurazione e otterrete dei messaggi animati e personalizzati in posizione e colore.

Se volete vederlo all'opera direttamente su questa pagina, cliccate sul bottone seguente



Carino eh? :))

Se volete vedere il complessissimo codice di questo esempio, usate git e fate un pull per aggiornate il repository che avete in locale, altrimenti, se non lo avete ancora fatto, clonate il repository come mostrato in questo post.

Se analizzate il codice, vi accorgerete che toastr dipende a sua volta da un'altra libreria che si chiama jquery, inoltre bisogna procurarsi il foglio di stile css per rendere gradevoli i messaggi.

In questo caso, poichè toastr dipende da jquery, jquery deve essere caricato prima in memoria dal browser.

Immaginate di dover implementare ex novo ciò che fa toastr .. evviva la pigrizia ;)

Alla prox
Ivan