Molte volte non riusciamo a trovare una soluzione ad un problema per via di una conoscenza limitata della materia, altre invece capita di trovarsi davanti ad un problema prettamente logico dovuto ad una cattiva strutturazione del codice. Questo genere di errori ci porta ad investigare su dove risiede l’errore che fa saltare tutta la nostra logica. Qui entra in gioco una vera e propria sfida con il noi del passato: qualche tempo fa abbiamo sbagliato a scrivere una parte del programma ed abbiamo fallito, oggi gareggeremo con noi stessi per capire se siamo riusciremo ad ottenere un risultato migliore.

Per rendere la sfida più semplice sono tecniche che possono aiutare uno sviluppatore a risolvere i problemi di ogni progetto.
Oggi ho cercato di riassumere le mie personali migliori cinque:

1 — Semina soluzioni, raccogli intuizioni

Un’idea tanto stravagante quanto interessante è quella che ipotizza l’esistenza di un Google interno. È come se dentro ognuno di noi sia presente un motore di ricerca che si attiva quando abbiamo bisogno di un’intuizione. Che sia il ritrovare il mazzo di chiavi o trovare un nome per la nostra nuova startup basta lasciar lavorare il nostro Google interiore per poi avere, quando meno ce l’aspettiamo, un flash con una soluzione geniale!

Il concetto di Google Interiore l’ho appreso da questo video di Robin Good in cui spiega come ha avuto l’intuizione geniale per il suo nome

Ovviamente il nostro G.I. ha bisogno di un combustibile che gli dia energia ed il modo migliore per fornirgliene di qualità è quello di leggere, lasciarsi contaminare e cercare di guardare il mondo da prospettive diverse.

Alimentare il nostro motore, e farlo in molti ambiti diversi, è come spargere nel campo della nostra mente semi di possibili soluzioni. Non tutto ciò che impareremo ci servirà nella vita, ma sempre meglio avere qualche cartuccia in più che ritrovarsi a corto di munizioni, non trovate?

Consiglio a tutti di iniziare a prendere l’abitudine di leggere quotidianamente sugli argomenti del proprio lavoro.

Per esempio personalmente, ogni giorno, leggo decine di articoli su programmazione, miglioramento personale e sul fare impresa.
Sulla tematica programmazione mi piace leggere articoli su tematiche anche differenti dai linguaggi e framework che utilizzo giornalmente.
Imparare su tematiche non strettamente facenti parte della mia confort zone mi permette, oltre a tenermi costantemente aggiornato ed allenato, di conoscere altre tecnologie da poter approfondire o usare in un futuro in cui possa servire.

Così facendo fornirai alla mente spunti nuovi per creare collegamenti sia futuri che per soluzioni che sono rimaste “in attesa” di essere smistate dal motore interno.

2 — Rubber duck, il debugger

Si dice che il modo migliore per imparare qualcosa sia quella di doverla spiegare ad un’altra persona. Cosa succederebbe se si portasse questa teoria nel mondo della programmazione? Facile, otterremmo una papera di gomma!
Su questa tanto semplice ma geniale intuizione deve essere nato il metodo Rubber Duck.

Il metodo di debug funziona così: in qualche modo dobbiamo entrare in possesso di un’anatra di gomma e tenerla a portata di mano per le sessioni di debug. Alla prima occasione utile, quando avrai un problema, non servirà fare altro che spiegare all’anatra il problema da risolvere e come si è deciso di implementare la soluzione e successivamente spiegare l’implementazione mentre lo si legge riga per riga.

Provando a leggere il codice ad un certo punto ti renderai conto che quello che quello che ti serviva scrivere non coincide con il codice prodotto e l’errore verrà fuori per magia! L’anatra quindi potrà essere serena e felice nella consapevolezza di averti aiutato.

Ovviamente anche un collega potrebbe essere in grado di sostituire l’anatra, tuttavia questo non sempre è possibile. Inoltre si sa…le anatre son animali comprensivi e non riveleranno mai a nessuno il vostro errore ;)

3 — Prenditi una pausa

Risolvere un bug che abbiamo prodotto è come gareggiare con se stessi, risolvere un errore significa migliorare sia la codebase che la nostra capacità di scrittura del codice.

Non sempre però al contrario, se non dovessimo riuscire a risolvere un errore, deve significare che questo è troppo grande per noi. Semplicemente in quel momento potremmo essere stanchi, demotivati, o poco concentrati.

Stanchezza, stress e pensieri extra lavorativi sono sempre dietro l’angolo, e se non riusciamo a separarci da queste preoccupazioni forse è il caso di separarci dallo scrivere codice. Prenditi una pausa.

Se il problema è risolvibile, come una stanchezza momentanea dovuta al poco sonno è inutile continuare a sbattersi davanti ad un problema che ora dopo ora sembra diventare sempre più complesso da risolvere. Spegni semplicemente il pc e vai a riposare.

Al contrario se il problema ha una natura persistente nel tempo il miglior consiglio che posso darti è smettere di programmare per un po’.
Sappiamo tutti che scrivere codice che non compila o che è pieno di errori non fa altro che aumentare il livello di stress.

Personalmente mi è capitato in passato di perdere la voglia di sviluppare ed ho semplicemente smesso di farlo per circa 6 mesi. In quel periodo credo di aver fatto il miglior salto di qualità della mia vita. Certo ero giovane ed ancora la programmazione non era il mio lavoro, quindi potevo permettermelo, e so benissimo che non sempre questo sia possibile. Ma il lasso di tempo può essere sicuramente più breve. Quando si stacca per un po’ da un lavoro che non ci dà più stimoli o che ci stressa capiamo se veramente ci manca e se ci piace farlo.
Personalmente staccare in quell’occasione mi ha permesso di vedere il tutto da una prospettiva diversa, e così una pausa ha dato, paradossalmente, un’accelerata alla mia carriera.

4 — Concentrati!

Non sempre il contrario di una buona idea è una pessima idea.
Un esempio lo abbiamo nelle strategie adottate dai supermercati dove coesistono sia il principio di abbondanza che quello di scarsità.
Nel primo gli scaffali dei supermercati vengono riempiti di mille prodotti, e i ripiani pieni ci fanno capire quanto un negozio sia affidabile e ben tenuto.
La seconda strategia invece si basa sul principio inverso, ossia sul far percepire una mancanza sistemica di un prodotto che ci porta ad aumentarne il nostro valore percepito (lo abbiamo sperimentato di recente con la strategia di lancio dei Nutella Biscuits, ricordate?).

Quindi se prima parlavo di rilassarti e staccare, ora ti urlo: CONCENTRATI!

Nella vita odierna siamo bombardati da mille distrazioni, e queste possono essere una causa per il nostro cattivo rendimento. Quando lavoriamo infatti dovremmo cercare di limitare al minimo le distrazioni cercando di vivere a pieno l’attimo di produttività.

Non è semplice e soprattutto all’inizio avremo bisogno di aiuto, qui cade a fagiolo la tecnica del pomodoro.

La tecnica del pomodoro è un metodo di gestione del tempo ideato alla fine degli anni ’80.
Il nome deriva da quei timer a forma di pomodoro, spesso utilizzati in cucina per tenere sott’occhio i tempi di cottura.

La tecnica consiste nell’impostare il proprio lavoro in slot da 25 minuti in cui lavorare senza sosta e senza distrazioni (posa quel cellulare!), per poi poter godere di 5 minuti di meritato riposo e distrazioni. Ogni quattro pomodori poi si fa una pausa più corposa di almeno 15–20 minuti.

Questo ci permette di non essere bombardati da mille problematiche ed aiuta a concentrarsi su un solo problema alla volta, combattendo il multitasking che tanto ci rende improduttivi.

5 — Outside the box

Certe volte possiamo anche provare a parlare con la nostra papera, riposarci o concentrarci ma non c’è modo di trovare la soluzione al problema che ci attanaglia. È facile in questi casi addossare la colpa ad agenti esterni (N.d.R. esiste un bias cognitivo per cui siamo portati a giustificare con la “sfortuna” errori nostri che negli altri avremmo affibbiato all’incompetenza) ma la verità è che se abbiamo un problema, soprattutto nella programmazione, è per un nostro limite.

Ricordati che non puoi risolvere un problema con lo stesso tipo di pensiero che hai usato per crearlo.

Per riuscire a dare una scossa alla situazione la cosa migliore che possiamo fare è quella di provare a guardare il problema da un’altra angolatura domandandosi per esempio: sarebbe più facile se cambiassi il pattern di sviluppo o se utilizzassi un’altra libreria invece di quella a cui sono abituato?

Le soluzioni più brillanti si trovano provando a pensare in modo desueto. Lì risiede il genio e la creatività che devono essere doti di spicco di un programmatore. Se ci abituassimo a pensare e progettare con una creatività dirompente riusciremmo a trovare sempre le migliori soluzioni per ogni enigma.

Un bell’esempio sul pensiero creativo (seppur totalmente di fantasia) potrebbe essere quello fornito dalla navetta spaziale usata dai protagonisti di Futurama per effettuare le consegne: la Planet Express.

Davanti alla necessità di avere un mezzo che sia il più rapido possibile il professore della serie ha un’idea fantasiosa e disruptive: dar vita ad un motore capace di mantenere il veicolo immobile e di spostare invece l’intero universo attorno ad esso.

E tu, ci avresti mai pensato? Provando a sforzarti, come potresti risolvere quel bug noto pensando fuori dagli schemi?

Una riflessione…

Rileggere il mio stesso codice è un’attività che mi appassiona parecchio perché mi aiuta a capire se sono migliorato o meno nel corso del tempo.

La passione per la programmazione esiste anche in virtù del fatto che ci si ritrova davanti a sfide sempre più grandi e per affrontare questa continua battaglia ci spingiamo in un ciclo iterativo incrementale di miglioramento personale.

Questo in un senso più ampio ci da uno stimolo per apprezzare e riempirci sempre di più la vita. Just Mick ha trattato questo argomento in suo recente video che ho molto apprezzato, ve lo lascio e nel mentre vi auguro buona vita e buon coding!

Facciamo un gioco. Prova ad andare da una persona che non si occupa in alcun modo di informatica e chiedile, secondo lei, quale animale meglio descriverebbe uno sviluppatore. Probabilmente sceglierà un animale della notte. Perché nell'ideale comune, e con una certa dose di ragione, il programmatore è immaginato come un lupo solitario che opera con il favore delle tenebre a roba che nessuno saprebbe fare o spiegare.

Questo era abbastanza vero fino ad un passato recente ma ad oggi, ci troviamo in una situazione in cui, anche a causa della forte verticalizzazione delle competenze richieste dal mercato, lo sviluppatore ha bisogno di contatti continui con altri tecnici o con figure che hanno competenze complementari come design e marketing. Il far lavorare insieme queste diverse risorse può creare nei casi di successo un’inarrestabile macchina perfetta, ma nei casi più sventurati può rendere anche un progetto semplice il peggior incubo che abbiate mai avuto.

Quindi se riguardando al tuo ultimo progetto in team invece di pensare alla Sinfonia n. 9 di Beethoven, in cui tutti lavorano in ordine e non si sentono suoni fuori dal coro, ti viene in mente Jack di Shining che bussa alla porta di casa… beh forse abbiamo un problema.

In alcuni casi il fallimento di un esperienza di team potrebbe essere correlato ad alcuni aspetti psicologici tra cui figura la protagonista indiscussa di quest’episodio: l’Apatia dello spettatore.

Nel caso in cui non conoscessi questo fenomeno, per capire rapidamente di cosa si tratta: hai presente quei video in cui vengono simulati incidenti, o situazioni di evidente difficoltà, in cui nessuno aiuta il malcapitato? Questi rappresentano perfettamente l’Apatia dello spettatore o effetto testimone, cioè un fenomeno per cui, in presenza di altre persone ed in una situazione d’emergenza, non si si offra alcun aiuto ad una persona in difficoltà.

Gli esperimenti di Latané e Darley

Questo fenomeno venne ipotizzato per la prima volta negli anni ‘70 da due psicologi sociali Latané e Darley, a seguito del crudele omicidio di Kitty Genovese in cui nessuno dei testimoni pur avendone l’occasione chiamò la polizia. La società fu sconvolta dal fatto ed i giornali si riempirono di attacchi alla morale pubblica. Ma gli psicologi cercarono di andare oltre la prima impressione ed elaborarono l’idea di una correlazione tra la mancata iniziativa e l’alto numero di testimoni presenti. Per dimostrarlo furono molto impegnati in una serie di esperimenti sociali, di cui per semplicità ne riporterò due:

L’attacco di epilessia per strada

Nel primo chiesero a uno studente di simulare un attacco di epilessia nelle strade di New York allo scopo di registrare i casi di soccorso da parte dei passanti. La scena venne ripetuta più volte di fronte a quantità diverse di persone, per per capire se questo incidesse sulla probabilità di intervento.
I risultati furono strabilianti, tanto chiari quanto inaspettati. Contrariamente a quanto ci si potrebbe aspettare quando il numero di testimoni aumentava, le probabilità che qualcuno aiutasse lo studente diminuivano. L’effetto era tutt'altro che superficiale: lo studente riceveva assistenza nel 85% dei casi quando era presente una sola persona, ma soltanto il 30% dei casi quando ce n’erano cinque.

Un incendio in sala d’aspetto

In un altro studio, i ricercatori si concentrarono su gruppi di individui in una sala d’attesa. Questa volta non fu simulata una crisi epilettica, ma diedero l’idea che nell'edificio fosse scoppiato un incendio facendo in modo che del fumo filtrasse da sotto la porta. Ancora una volta, più il gruppo era numeroso, e più si riducevano le probabilità che qualcuno desse l’allarme. In questo caso il 75% delle persone che sedevano da sole segnalavano il pericolo, contro il 38% quando nella stanza vi erano tre soggetti.

Le motivazioni

Ma perché l’istinto di aiutare gli altri diminuisce all'aumentare delle persone presenti? Sul piano dell’istinto quando ci ritroviamo in una situazione inusuale, come davanti ad una persona che si accascia per strada, dobbiamo come prima cosa capire cosa stia succedendo. Si tratta di una vera emergenza, oppure è solo inciampato, oppure sta girando una scena per qualche video su YouTube?

Nonostante la miriade di possibilità dobbiamo decidere velocemente. Il modo più rapido ed istintivo è osservare il comportamento degli altri. Stanno andando ad aiutare o continuano a fare i fatti propri? E poiché la maggior parte delle persone non vuole distinguersi dalla folla, tutti guardano gli altri in cerca di suggerimenti, generando uno stallo, per cui alla fine si può arrivare a pensare: se nessuno fa nulla, qui non c’è niente di grave, andiamocene.

Anche se riuscissimo a percepire un reale bisogno di aiuto, c’è sempre la questione della responsabilità In quasi tutte le situazioni quotidiane, non vi è una gerarchia chiara: è vostro compito intervenire, oppure dovreste lasciar fare al tizio laggiù che magari è più preparato? Tutti i membri del gruppo ragionano nello stesso modo, perciò può accadere che nessuno faccia nulla.

Apatia ed elefanti nel lavoro

Una volta appreso di questo fenomeno ci verrà più facile notarlo nella vita di tutti i giorni. Quindi avremo maggiori chance di migliorare il nostro impatto nella società. Oggi però mi piacerebbe soffermarci particolarmente sulle conseguenze che porta in ambito lavorativo.

Le aziende moderne provano spesso ad incoraggiare i dipendenti a comunicare tra loro e adoperarsi/segnalare problemi in modo autonomo. Quello che succede però è che la ridondanza delle informazioni tra persone può causare comunque l'effetto spettatore ed impedire una risoluzione o comunicazione proattiva.

Sembra come se nei progetti ad un certo punto balzi fuori un Elefante nella stanza, e che nessuno voglia prendersi la briga di accompagnarlo fuori.

Quando abbiamo situazioni impossibili da ignorare, come uno sconosciuto che sviene per strada o un evidente elefante nella stanza, se tutti fanno finta di nulla la ragione non può essere altro che così facendo si spera interiormente che il problema scompaia da sé.

Bisognerebbe arrivare alla considerazione che la vita è come un gioco in cui dobbiamo scegliere che ruolo avere: vogliamo essere protagonisti o personaggi secondari? Vogliamo delegare sempre agli altri senza neanche provare a metterci in gioco? Oppure vogliamo rimboccarci le maniche per dimostrare il nostro valore quando ne avremo occasione?

Come migliorare

Gli argomenti trattati in quest’articolo possono sembrare diversi tra loro ma c’è un’elemento comune: la responsabilità. Che tu sia un manager, un libero professionista o un dipendente è fondamentale, prima di ogni cosa, lavorare sul proprio senso di responsabilità, sulla consapevolezza delle proprie capacità e sulla volontà di metterle al servizio degli altri nel momento opportuno. Ma eccoti comunque una lista di consigli che possono aiutarti a coordinarti meglio con gli altri evitando l’effetto spettatore:

• Lavorando in team prova a mettere a proprio agio tutti i componenti della squadra, la comunicazione deve essere sempre incentivata. Meglio dire due volte la stessa cosa che non dirla mai. Inoltre aiuta a ridurre la diffusione della responsabilità enfatizzando il contributo di ciascuno.
• Se dovessi aver bisogno di aiuto: assegna incarichi ad personam per far sì che qualcuno si senta responsabile. Se nel progetto a cui stai lavorando hai bisogno di un intervento indica chiaramente da chi te l’aspetti. Allo stesso modo se per strada finisci in preda ad un malore un semplice gesto può salvarti la vita: indica qualcuno vicino e chiedigli di chiamare i soccorsi. Così facendo triplicherai le possibilità di un intervento.
• Divieto assoluto per email generiche con troppi destinatari. Vietati anche messaggi che hanno bisogno di una conferma in canali di comunicazione pubblici (Slack sei tu?) con troppe persone. In presenza di più destinatari si tende a pensare che la responsabilità di rispondere sia sempre di un altro e potrebbe capitare che nessuno alla fine lo faccia.
• Prendi consapevolezza dell’effetto del testimone prova a vincere la tendenza a star fermi quando ci sono altre persone. Nel lavoro l’intraprendenza è, tendenzialmente, premiata mentre nella vita di tutti i giorni potresti fare la differenza. Se non avessi le competenze per risolvere il problema, come visto prima, anche il solo gesto di chiamare aiuto può salvare la vita di uno sconosciuto, figuriamoci quanto bene può fare nel lavoro.

Ora che hai scoperto cosa significa l’apatia dello spettatore, la prossima volta che avrai davanti una situazione insolita cosa farai? Vorrai essere uno spettatore o il protagonista della tua storia? Pensaci. Nel frattempo non mi resta che augurati buona vita.

Entropia

Entropia è un termine utilizzato in fisica ed indica il livello di disordine presente in un determinato sistema. Un sistema si può definire tanto più disordinato maggiore è il numero di informazioni che servono a descriverlo. Esiste inoltre una legge della termodinamica che enuncia come il livello di entropia, nel tempo, sia destinato ad aumentare.

Come sviluppatori, conoscere ed aver interiorizzato il concetto di entropia in un progetto può aiutarci a scrivere codice migliore. Quindi vi prego sedetevi comodi, allacciate le vostre cinture e prepararvi ad un, breve ma intenso, viaggio nella mente umana.

Come nasce il disordine

Da sviluppatore, ammetto di appartenere ad una razza davvero strana, ogni inizio progetto segue lo stesso copione: ci ripromettiamo che questa sarà la volta giusta, che riusciremo a tenere tutto in ordine, a prova di bug e che il prodotto finale sarà manutenibile nel tempo.

Poi passa qualche settimana e senza accorgercene e ci ritroviamo con un progetto che è diventato un disastro: c’è qualche bug ma non sappiamo da dove provenga; c’è del codice duplicato sparso nell'applicativo; e quel metodo sappiamo che non è scritto secondo le guidelines… ma funziona così bene che sarebbe un peccato rimpiazzarlo!

Insomma il livello di disordine nel progetto è diventato tale che servirebbe proprio un bel refactoring. Purtroppo però siamo indietro con le scadenze ed il cliente ha anche chiesto delle modifiche urgenti.

Quindi anche questa volta, forse, il progetto giusto sarà il prossimo…

Ma come nasce il disordine?
La risposta è tutt'altro che semplice, ma forse, la teoria delle finestre rotte può venirci in aiuto.

La teoria delle finestre rotte

Nel 1969 il professor Philip Zimbardo condusse un esperimento di psicologia sociale. Egli lasciò due automobili identiche, stessa marca, modello e colore abbandonate in strada, una nel Bronx, zona povera e conflittuale di New York, l’altra a Palo Alto, città ricca e tranquilla della California.
Lo scenario era quindi quello di due identiche auto abbandonate in due quartieri con tipologie molto diverse di abitanti, con una squadra di specialisti in psicologia sociale a studiare il comportamento delle persone in ciascun sito.

Ciò che accadde fu che l’automobile abbandonata nel Bronx cominciò ad essere smantellata in poche ore, perdendo le ruote, il motore, gli specchi, la radio, e così via; tutti i materiali che potevano essere utilizzati vennero rubati e quelli non utilizzabili vennero distrutti.
Al contrario, l’automobile abbandonata a Palo Alto rimase intatta. In tali casi è comune attribuire le cause del crimine alla povertà. Tuttavia, l’esperimento in questione fu proseguito. Dopo una settimana, durante la quale la vettura abbandonata nel Bronx era stata completamente demolita mentre quella a Palo Alto era rimasta intatta, i ricercatori decisero di rompere un vetro della vettura a Palo Alto; in breve tempo i ricercatori assistettero alla stessa dinamica di vandalismo che avevano registrato nel Bronx: furto, violenza e vandalismo ridussero il veicolo lasciato a Palo Alto nello stesso stato di quello abbandonato nel distretto malfamato di New York. (fonte: Wikipedia)

Zimbardo osservò che la maggior parte dei saccheggiatori non avevano affatto l’aspetto di criminali o persone disagiate, sembravano invece persone comuni che mai avremmo classificato come vandali prima di vederle all’opera. Secondo Zimbardo, il finestrino rotto dell’automobile costituisce un indizio di abbandono dell’area, il quale a sua volta è in grado di svegliare in noi peggiori istinti, forti del fatto che difficilmente verremmo giudicati o puniti per le nostre azioni.

Le finestre rotte nel codice

Ora proviamo a portare quest’esperienza nella vita reale. Proviamo a pensare a quando lavoriamo in un progetto di cui abbiamo anche la sola impressione che sia un lavoro sprecato o di bassa qualità. La teoria delle finestre rotte ci spiega come inconsciamente siamo portati a risparmiare le nostre energie e continuare su una strada tracciata male o peggio ancora a tracciarne noi una di pessima fattura.

È infatti una cosa nota che non solo l’entropia di un sistema aumenterà con il tempo, ma che l’energia per ordinare un sistema sia di gran lunga maggiore di quanta ne serva per disordinare o lasciarsi trascinare dalla corrente.

In questi casi dobbiamo ricordarci dell’antica leggenda cinese che racconta di una carpa perseverante che riuscì a risalire una ripida cascata, superando ostacoli e spiriti malvagi per poi essere premiata dagli dei, impressionati da tanto coraggio, che la trasformarono in un grande drago. Allo stesso modo ogni giovane programmatore, nell'intento di migliorare sé stesso, dovrebbe provare a migliorare ogni progetto che tocca cercando di remare contro la corrente che porta alla deriva dell’entropia.

Ovviamente capiterà anche i team migliori di dover mettere una toppa per una presentazione del prodotto o per qualche richiesta urgente del cliente, qui però vi esorto a non lasciare mai finestre rotte nel codice.

Conclusioni

La qualità del codice che scriviamo è dettata, molto più di quanto immaginiamo, da bias cognitivi che possono scaturire da diverse fonti. Tra queste troviamo spicca l’idea che abbiamo del progetto ed il suo prestigio. Saremo portati a fare un buon lavoro per un progetto che sarà largamente usato, mentre al contrario, tenderemo a non spenderci troppo per progetti che reputiamo secondari.

Anche lo stato di un progetto al nostro ingresso, il suo scaffolding, la presenza o meno di una documentazione e di commenti di qualità condiziona il lavoro nostro e degli altri programmatori. E noi, dopo quanto detto in precedenza, vogliamo far trovare agli altri una macchina in perfette condizioni o con qualche finestrino rotto?

L’entropia è destinata ad aumentare ma sta a noi cercare di limitarla. È cosa nota che nelle ultime battute di un progetto gli sviluppatori tendono a “rilassarsi” scrivendo codice con meno qualità rispetto che all'inizio. Qui si annidano i maggiori rischi, perché un programma non termina quasi mai il suo ciclo di vita con la prima release: aggiornamenti, bug fixing e nuove richieste da parte del cliente sono sempre dietro l’angolo. Abbassando la guardia ci troveremo a dover costruire in futuro su una struttura instabile. Sarebbe come fare una maratona e smettere di correre a pochi passi dal traguardo.

Come si può migliorare

• Se possibile prendetevi il tempo necessario per valutare più soluzioni, schematizzarle, e solo dopo scegliere quella che offre il miglior rapporto qualità/tempo di sviluppo.
• Investi del tempo, prima di scrivere il codice, per scrivere una buona documentazione per ogni parte del tuo programma.
  Si dice che il miglior modo per scrivere codice di qualità sia quello di limitarne la scrittura al numero minimo di righe che lo rendano conforme ai requisiti o alla documentazione.
• Nel caso di soluzioni poco eleganti ricordatevi di darne evidenza al responsabile del progetto, o se siete voi stessi al cliente, in modo da poter valutare insieme un successivo intervento di refactoring.
• Lasciate un commento al codice in cui spiegate come si potrebbe risolvere diversamente il problema e chiarite la motivazione delle vostre scelte. Dover scrivere una possibile soluzione mette in moto la vostra capacità di problem solving e una nuova strada potrebbe magicamente apparire!
• Se ti dovessi imbattere in un progetto che ricorda una macchina abbandonata nel Bronx, non prendere anche tu la mazza da baseball per sfasciare tutto, ma armati di buona volontà e, anche se non sarà sempre possibile, dai il massimo per ridurre al minimo l’entropia!

Oggi abbiamo capito come l’entropia sia una componente importante da considerare nei progetti a cui lavoriamo giornalmente, abbiamo anche visto qualche modo per poterla arginare, ma ricordiamoci sempre che il modo migliore per avere progetti stabili nel tempo è sempre quello di lavorare con metodo ed ordine.

Non mi resta che augurarvi un buon coding e buon ordine.

Cos'è l’entropia ed altre tristi storie di codice scritto a fine progetto. was originally published in The Wave Studio on Medium, where people are continuing the conversation by highlighting and responding to this story.

Il mio background

Mi chiamo Luca e sono il lead dell’area front-end web in The Wave Studio, l’agenzia che ho co-fondato poco più di un anno fa.
Ed ogni tanto penso che forse sono sempre stato un impostore.

La vita da sviluppatore non è semplice dato che nel nostro ambito c’è un’evoluzione repentina e continua: ogni 2–3 anni le tecnologie che ami e che usavi diventano obsolete e vengono surclassate da nuovi linguaggi o framework non dando mai la possibilità di adagiarsi sugli allori e farsi forte di una conoscenza che non va mai a “scadere”.

Io, dal canto mio, ho sempre studiato da autodidatta ed ho programmato quasi tutti i giorni della mia vita da quando ho scoperto questo magnifico mondo: all'età di 15 anni realizzavo già siti per i miei primi progetti giovanili; nel 2013, ancor prima di diplomarmi, collaboravo con un’agenzia digitale di Padova da remoto; oggi leggo almeno 10 articoli al giorno, coordino un team di sviluppatori ed ogni tanto mi spendo come speaker ad eventi di settore; insomma mi sono sempre dato da fare e diciamo che nel corso del tempo ho accumulato una discreta esperienza.

Il problema

Però sin dal primo giorno, sopratutto quando ero più inesperto e sviluppavo interi progetti cercando sistematicamente la soluzione dei miei problemi su Google, ho sempre avuto un dubbio:

“Ma sono davvero un bravo Developer o sono solo una truffa, un impostore?”.

Per anni ho vissuto con questo dubbio che si faceva vivo prima dell’inizio di una nuova sfida oppure quando c’era il rischio che qualcuno potesse vedere le mie tab del browser su tutorial o su qualche soluzione trovata su Stack Overflow e per paura che potessi essere beccato ed additato come un incompetente chiudevo sistematicamente tutte le finestre non appena letta la soluzione al mio problema (creando delle situazioni al limite del tragicomico quando per la fretta di chiudere le finestre non arrivavo neanche a leggere correttamente la risposta ndr).

A nulla valse la frase, che ad oggi recito come un mantra, che mi venne detta dal mio tutor in uno dei miei primi lavori:

“Un bravo sviluppatore non deve conoscere tutte le funzioni, ma deve sapere cosa si può fare e come/dove andarlo a cercare”

La Consapevolezza

Con il tempo ho capito che quello che provavo non era altro che una forma della Sindrome dell’impostore, ossia la difficoltà di alcuni individui di riuscire a valutare i propri risultati come espressione del proprio lavoro o talento ma anzi indicare come possibile causa dei propri successi un elemento esterno come la fortuna o l’inesperienza di chi giudica il proprio operato.
E se proverete a cercare questa sindrome su Google vi renderete conto di come questo fenomeno sia largamente diffuso tra developers che vivono le difficoltà di un mondo incredibilmente vasto e subiscono le problematiche di un sistema che non da loro mai la certezza di conoscere una tematica fino in fondo.

Da ogni elemento di difficoltà però bisogna trarne un punto di forza, quindi una volta capito cosa stessi vivendo ho iniziato un percorso di miglioramento personale. Se non potevo avere la certezza di essere davvero uno sviluppatore valido non potevo far altro che diventarlo imparando ogni giorno qualcosa di nuovo, ho quindi inserito alcune abitudini come: leggere giornalmente articoli e libri tecnici appena sveglio e prima di andare a letto; seguire costantemente corsi e video corsi; mettermi in gioco andando ad eventi come speaker per dimostrare a me stesso quanto potessi valere.

Conclusioni

Ad oggi credo che questo sentirmi costantemente in dubbio non abbia fatto altro che dare una forte spinta alla mia carriera facendomi spendere sempre al massimo per dimostrare, a me prima che agli altri, che potevo raggiungere qualsiasi meta con il sudore della mia fronte.

Se anche tu vivi questa situazione sappi che non sei l’unico e che “non esiste buono o cattivo tempo, ma solo buono o cattivo equipaggiamento” quindi anche davanti una difficoltà come questa se riusciremo a trovare i giusti mezzi potremo rendere una situazione sconveniente un’opportunità per poter spiccare il volo.

Ps: Sapevi che la sindrome dell’impostore è spesso associata al cosiddetto effetto Dunning-Kruger, una distorsione cognitiva a causa della quale individui inesperti tendono a sopravvalutarsi, rifiutando di accettare la propria incompetenza e viceversa persone competenti tendono a sminuire il proprio reale valore? Quindi magari il sapere di non-sapere non fa altro che indicare che sei una persona valida?

Mi capita spesso di pensare che forse il mondo sarebbe un posto migliore se tutti noi conoscessimo almeno un linguaggio di programmazione, ma quando lo dico la risposta che in genere mi viene data è: <Ah ma che dici Luca… Se tutti conoscessero come sviluppare oggi probabilmente saresti disoccupato!>.

Niente di più sbagliato perché esiste una profonda differenza tra chi sa cucinare e chi di mestiere fa lo chef. Saper cucinare ci migliora la qualità della vita, ci fa risparmiare, divertire e conoscere persone che condividono la stessa passione; ma non per questo dobbiamo essere tutti Chef.

Ecco qui quindi 4 buoni motivi per smetterla di essere passivi in questo mondo digitale ed invece tuffarsi nel mondo della programmazione:

1 — Avere conoscenza di come funzionano le cose

Conoscere la logica che sta alla base della programmazione ci permette di vivere in modo più completo i programmi che usiamo tutti i giorni. Ovviamente non dobbiamo essere dei guru ma conoscere come funziona ciò che usiamo ci permette di sfruttarne al 100% le potenzialità.

Questo è un meccanismo che adottiamo in modo quasi inconscio durante la vita, per esempio lo abbiamo fatto quando abbiamo studiato per la patente: in quell'occasione infatti, non serviva conoscere la logica alla base della macchina ma avere ben chiaro il meccanismo per cui funzionano la frizione e acceleratore ci aiuta a guidarla meglio.

Inoltre una conoscenza della tecnologia ci permette di sapere cosa si può realizzare e cosa no, magari questo potrebbe anche farci venire un’idea su un nuovo progetto imprenditoriale, no?

2 — Combattere analfabetismo funzionale e decadenza celebrale

Il termine analfabetismo funzionale, indica la difficoltà nella vita quotidiana di usare in modo efficace le abilità base di lettura, scrittura e calcolo.

Secondo varie fonti la percentuale stimata di analfabeti funzionali in Italia si attesta intorno al 47%, qui un po’ di dati raccolti da Sky, il che significa che una persona su due ha difficoltà a vivere la vita di tutti i giorni a causa di questa disfunzione. Analfabeti funzionali non si nasce e possiamo lavorare per migliorare questa condizione con un allenamento continuo della nostra mente nell'analisi della logica.

Parlando invece di decadimento celebrale, quante volte capita di non ricordare cose semplici o di renderci conto che anche operazioni matematiche semplici ci richiedono parecchio tempo?

Questo fenomeno è sempre più diffuso con l’aumentare dell’età o con la pratica di affidare sistematicamente operazioni ad un assistente (ti ricordi per caso quand’è stata l’ultima volta che avete fatto una moltiplicazione a due cifre a mente?) ma non tutto è perduto, possiamo tenere la nostra mente attiva in vari modi.

La programmazione ci permette di stare sempre in allenamento: si creano percorsi logici; si fanno calcoli e si risolvono giornalmente problemi di varia complessità.

3 — Risolvere o semplificare problemi

Come detto prima programmare significa scrivere indicazioni da passare ad un device su come risolvere un problema. Per i programmatori non esistono problemi o situazioni che non possano essere risolte, semplificate o ottimizzate.

Nella vita possiamo individuare un mare di problemi o situazioni che possano essere ripetitive e che magari ci siamo stancati di risolvere manualmente perché costerebbe troppo e/o ci farebbe impazzire.

In questi casi scrivere del codice ci può aiutare la dove il computer è più bravo, ossia nelle attività monotone e ripetitive come: ricopiare un lungo testo partendo da foto (OCR) piuttosto che inserire manualmente una lista di informazioni in un foglio Excel.

Conoscendo la programmazione potremo scoprire come con poche righe anche un’attività lunga e frustrante può essere risolta facilmente e farci sentire la persona più felice e capace al mondo.

Un’altra caratteristica dello scrivere codice è che c’è sempre un modo di migliorare il codice scritto per risolvere un problema in maniera più veloce, elegante ed efficiente, quindi possiamo sempre provare a migliorarci gareggiando con il noi del passato!

4 — Puoi trovare lavoro facilmente e puoi farlo da dove vuoi

Essere uno sviluppatore nel 2020 significa avere una vasta gamma di azienda da cui poter attingere per trovare lavoro, infatti come dicevo in un mio vecchio articolo: “il problema è che più del 40% delle aziende digitali in italia non riesce a trovare persone da assumere per i ruoli cercati”. Quindi almeno per i prossimo 5 anni questa professione è sicuramente un ottimo investimento!

La programmazione è una lingua comune a tutte le nazioni del mondo perché, sebbene usi principalmente l’inglese, è una rappresentazione della logica e della matematica. Per programmare non serve altro che un computer ed una connessione ad internet, il che rende questo mestiere particolarmente versatile.

La mancanza di attrezzatura fisica e facilità di essere capita universalmente rendono la professione dello sviluppatore aperta a posizioni lavorative in ogni paese del mondo indipendentemente dal contesto di provenienza.

A facilitare le iniziative di lavoro remoto c’è anche la prassi di aziende informatiche moderne che hanno adottato sistemi di tracciamento e pianificazione di attività presenti interamente online, il che rende la capacità dello sviluppatore e la sua produttività il miglior e più importante metro di giudizio.

5 — Bonus: Anche Obama sponsorizza la programmazione!

Quindi cosa aspetti? Ci vediamo dall'altro lato,
Buona giornata e buon coding! 😉💪

Quattro buoni motivi per cui dovresti imparare a programmare was originally published in The Wave Studio on Medium, where people are continuing the conversation by highlighting and responding to this story.

Questo articolo fa parte di una serie, puoi trovare il primo qui: https://medium.com/@ilasw/larte-di-ottimizzare-i-siti-web-parte-1-328378f8a9be

Nello scorso articolo abbiamo visto come possa essere importate ottimizzare un sito web, l’effort che attualmente i team spendono in questa pratica e quali sono le tecniche principali per ottenere dei risultati interessanti, oggi vedremo delle tecniche avanzate per aumentare la velocità effettiva e percepita dai nostri visitatori.

2.1 HTTPS && HTTP/2

HTTP/2, detto anche HTTP/2.0, è la nuova versione del protocollo HTTP che rende le applicazioni web più veloci, snelle e robuste, consentendo di fare a meno di alcune tecniche di ottimizzazione adottate fino ad ora.
Anche se non sembra il passaggio a questo protocollo di trasferimento aiuterà i nostri siti ad essere più ottimizzati grazie alle sue tante features:

• Da quando Let’s Encrypt ha reso possibile creare in modo autonomo i nostri certificati è possibile averlo quasi sempre Gratis o a bassissimo costo.
• Viene stabilita una sola connessione per server e quella connessione rimane aperta fino a quando il sito è aperto su browser, quindi si hanno, meno richieste per server e quindi un tempo di connessione inferiore.
• HTTP/2 usa HPACK, un formato di compressione per trasmettere in modo efficiente i campi Headers HTTP.
• Offre nuove funzionalità come la possibilità di impostare una scala di priorità nelle richieste a cui viene associata un peso e una dipendenza associata
• Questo protocollo è davvero troppo facile da impostare per non usarlo, ha mille funzioni native per ogni tecnologia per attivarlo in poche righe, ad esempio su Nginx si può attivare così:

2.2 Waterfall: L’Ordine di download delle risorse

Con il temine waterfall si intende l’ordine con cui il browser scarica, analizza e renderizza le risorse della pagina. Le pratiche per l’ottimizzazione del waterfall sono spesso ignorate e non si da particolare importanza a questo aspetto quando in realtà se la struttura della pagina è ben definita.

Sviluppare mischiando blocchi di HTML, CSS, JS crea numerosi blocchi nel rendering della pagina ogni volta che: si passa da una tipologia all'altra; si richiede una risorsa esterna; viene interpretato il codice JavaScript.
Con la conseguenza di aumento di latenza tra il momento in cui il contenuto inizia ad essere visibile a quando risulta essere effettivamente (DOMContentLoaded).

Molti Developer suggeriscono di mettere il CSS fondamentale per la pagina nel HEAD della pagina HTML: personalmente non amo questa soluzione, in quanto mischia il CSS con HTML, la ragione di questa pratica sta nel non dover caricare risorse esterne per iniziare a visualizzare la griglia e elementi fondamentali per la nostra grafica.

Caricare il CSS importante per prima, poi HTML ed infine JS: In generale la regola sempre verde è quella di incorporare tutti i nostri fogli di stile (meglio se pochi) nel <head> della pagina, per poi inserire dentro il <body> tutto il nostro HTML, e poco prima della chiusura di questo incorporare i JavaScript, ordinati per importanza. La ragione di questa pratica è quella di mostrare il contenuto con la nostra grafica mentre si attende che tutto il nostro HTML sia stato renderizzato (senza interruzioni) prima di avviare i nostri JS che sicuramente interagiranno con gli elementi della pagina.

Utilizzare async/defer per i tag script JavaScript non necessario da subito in quanto questo genere di codice è parser-blocking cioè quando il browser inizia a renderizzare HTML ed incontra uno script, sospende tutte le operazioni di lettura e rendering per poter eseguire il JavaScript. Per ridurre i blocchi possono essere utilizzati questi due attributi. In particolare:

• async: Lo script è caricato in modo asincrono e quando è pronto il parsing di HTML viene messo in pausa per eseguire lo script, quindi si riprende con il task precedente.

• defer: Lo script è caricato in modo asincrono e viene eseguito solo dopo che il parsing di HTML è completamente finito. Il vantaggio rispetto a mettere un JavaScript sul finire del <body> è che, sebbene l’esecuzione avvenga in entrambi i casi dopo il parsing di HTML nel caso di defer lo script è stato scaricato in parallelo all’analisi del codice HTML risultando più veloce.

2.3 Velocità percepita

La velocità percepita è la misura di quanto veloce le persone pensano sia il tuo sito, che in molti casi è più importante della reale velocità.

Facendo studi sull'esperienza di navigazione si è notato come si faccia molto più caso alle emozioni che il sito ci fa provare durante il caricamento rispetto a quello che realmente succede: un sito che carica 2 in secondi può risultare molto più lento di un competitor che impiega il doppio del tempo se questo adotta alcune pratiche per distrarre l’utente e fargli credere che qualcosa stia accadendo.

Le persone fanno molto più caso a cosa provano durante la navigazione rispetto a quello che sta realmente accadendo

Infatti il white screen è un’esperienza frustrante per l’utente, soprattutto da mobile, e lo porta a credere che il sito non sta rispondendo o che non funzioni.

Per migliorare l’esperienza dell’utente uno degli stratagemmi più usuali è quello di sfruttare l’effetto specchio-in-ascensore: infatti gli specchi di solito vengono appesi vicino agli ascensori, in modo da dare alle persone qualcosa da fare mentre aspettano che le porte si aprano, è risaputo infatti che fare o osservare qualcosa durante un’attesa distorce la nostra percezione del tempo facendo pensare che ne sia passato di meno. Ecco alcune buone pratiche:

Usare gli Skeleton Screens è una buona pratica quando si realizza una applicazione web in cui si fruiscono contenuti tramite APIs quella di mostrare nel tempo di caricamento dei blocchi che mostrano un anteprima della struttura che si otterrà una volta conclusa la chiamata al server. Questa pratica ha due vantaggi:

• Evitare il white screen e far vedere all'utente che il nostro sito sta funzionando e sta attualmente lavorando per servire la sua richiesta.
• Mostrare quale struttura avrà il sito per evitare sorprese e conseguente abbandono della pagina perché l’utente non trova quello che si aspettava

Quando si progettano gli skeleton screens, si consiglia in genere di associare un animazione al blocco per aumentare la percezione di dinamicità. In genere questa animazione si muove da sinistra verso destra, movimento che viene percepito più breve di quanto non sia il fade-in-out (opacità) dell’oggetto in loop.

Un altro modo per lavorare sulla velocità percepita è rendere il sito dinamico ed in costruzione in fase di loading come avviene su Instagram. Infatti caricare e rendere fruibile il contenuto nel tempo da un feedback positivo all’utente che può iniziare a navigare e porre l’attenzione sul contenuto che di volta in volta viene reso disponibile. In quest’ottica è necessario fare uso del lazy loading e assegnare una priorità al contenuto da scaricare come fa ad esempio medium che rende disponibile per primo il contenuto above the fold.

Conclusione

Con questo articolo abbiamo visto come portare l’ottimizzazione al livello successivo, lavorare sul server per sfruttare il nuovo protocollo HTTP2, abbiamo appreso come funziona il parsing ed il rendering del browser e come tratta i diversi tipi di contenuto. Come sia importante lavorare sulle emozioni che i nostri utenti provano durante la navigazione.

Nel possimo articolo vedremo come impostare i service worker per sfruttare il pre-caching e le funzionalità per navigare offline. Inoltre parleremo di Performance budget e del costo dell’uso del JavaScript.
Stay tuned!

Questo articolo fa parte di una serie:

• L’arte di ottimizzare i siti web — Parte 1 — Entry Level: https://medium.com/@ilasw/larte-di-ottimizzare-i-siti-web-parte-1-328378f8a9be
• L’arte di ottimizzare i siti web — Parte 2 -Medium Level: https://medium.com/@ilasw/larte-di-ottimizzare-i-siti-web-parte-2-medium-level-f48fb45fb202

Dal 14 al 16 Dicembre 2018 a Catania si è tenuta la Dev Fest, un evento targato Google in cui si trattano tramite talk, workshop, hackathon argomenti da Developer, magari inerenti al mondo del colosso della ricerca. In questa occasione ho preparato un talk su come ottimizzare progetti web, qui lascio la trasposizione in articolo.

Partiamo dal fatto che la maggior parte dei servizi ad oggi disponibili sono fruibili online. Il problema è che non tutti hanno a disposizione una rete 5G e l’ultimo modello di iPhone per navigare e fruire questi servizi; questo comporta avere un tempo medio di caricamento intorno ai 15 secondi (fonte Google 2016) ed un tasso di abbandono del 53% per i domini che mostrano 3 secondi o più di white screen.

Come fare a rimediare a questa fuga di massa dai nostri progetti online? La soluzione è semplice: Scrivere codice ottimizzato ed efficace. Facile, no?

Lo stato dell’arte dei nostri siti

Facendo una rapida analisi dei siti maggiormente visti in italia secondo SEMrush scopriamo come l’ottimizzazione viene valutata poco nei team di sviluppo di queste aziende, che fanno del web una parte importante del loro business. Un esempio viene dato dai siti di bmw.it o mediasetplay.mediaset.it dove non vengono usate le principali e basilari regole per velocizzare il tempo di caricamento del sito.

Cosa significa aumentare le performance

Molte volte ottimizzare un sito web sembra un’attività inutile e si preferisce dedicare effort verso attività più “produttive” per l’azienda, ma in rete sono disponibili molti dati ed esempi su come rendere un sito più velocemente fruibile influenza anche altre KPI (Key Performance Indicator).
Un ottimo spunto ci viene fornito da Google tramite la piattaforma Web Fundamentals dalla quale prendiamo giusto quale esempio.

Ridurre il bounce rate

Il sito COOK dopo aver ridotto il tempo di caricamento del sito di 850ms (meno di un secondo) ha ridotto il bounce rate del 7%, quindi le persone erano più propense ad esplorare il sito a parità di design ed abbandonavano meno dopo aver visto per poco solo la home.

Aumentano gli utenti e le interazioni

A volte non serve neanche migliorare davvero le performance del sito ma lavorare su elemento psicologici per aumentare il modo in cui i nostri utenti interagiscono con il sito: è il caso di Pinterest che ha aumentato le registrazioni e l’uso della ricerca del 15% quando hanno ridotto il “tempo di attesa percepito” del 40% (scopriremo dopo come farlo).

Aumentano le conversioni

Migliorare la fruibilità del sito significa anche vendere di più e lo dimostra AutoAnything che quando ha investito nello sviluppo per dimezzare il tempo di caricamento del sito ha riscontato un boost del 12–13% sulle vendite del loro ecommerce.

Ottimizzazione: Entry Level

Quali sono i primi passi per ottimizzare un sito web? Cerchiamo di vederlo tenendo il livello accessibile anche a non esperti.

1.1 Rimuovi il superfluo

In ogni progetto in fase di sviluppo sono presenti librerie esterne capita molto spesso che mettiamo un sito in produzione senza prima scremare tutto il codice che non serve. La prima regola per alleggerire la nostra code base è quindi togliere tutto quello che non ci serve.

Alcune regole:

• Ogni risorsa ha un effettivo valore? es. Non ha senso usare Bootstrap tutte le volte, se dobbiamo sviluppare una semplice landing page o un login con i social forse bisognerebbe pensare di non usarlo.
• Se proprio non possiamo farne a meno possiamo usare la risorsa/libreria prendendo solo quello che ci serve? Per esempio posso importare solo le griglie/mixins di Bootrap per avere un boost istantaneo alla produttività!
• Magari qualche risorsa è utile al progetto, ma sarebbe possibile riscrivere una parte del codice per alleggerire il tutto, un buon esempio potrebbe essere quello di rimuovere JQuery (Come ha già fatto GitHub) ed usare le nuove API del browser per gestire il DOM.
• In generale cerchiamo di mischiare librerie che hanno parzialmente o totalmente la stessa funzionalità, jQuery in compagnia di Librerie/Framework JavaScript come VueJS, React, Angular risulta davvero superfluo. (Si non le mando a dire a jQuery)

1.2 Minifica il resto

La compressione lato server delle nostre risorse è un ottimo stratagemma per servire un contenuto leggero senza perdere qualità.

Alcune regole:

• Minifica HTML, CSS, JS: è gratis, i file si possono comprimere direttamente durante la fase di sviluppo senza passare da tool diversi da quelli che usiamo già (WebPack, parceljs, gulp) e possiamo risparmiare anche il 25–30% sulle risorse statiche.
• Abilita la compressione GZIP per risparmiare fino al 70% di spazio, è largamente supportata e non crea problemi, per evitare rallentamenti dovuti alla compressione on demand possiamo pre-comprimere tutto il nostro codice configurando in pochi passaggi il server.

1.3 Gestione dei media: Immagini e Video

Immagini e video rappresentano la maggior parte dei dati che passano dai nostri server, ottimizzare questo aspetto migliorerà di molto le prestazioni.

Alcune regole:

• Le immagini devono avere sempre i tag richiesti di fallback “alt” in modo tale da permettere a chi è dotato di una scarsa connessione di iniziare a capire che tipo di contenuto sarà fruibile nella pagina (e Google apprezzerà in ottica SEO).
• Caricare media della dimensione giusta: quante volte carichiamo immagini enormi perché non si sa mai? Meglio più grande in fondo no? Beh, non proprio, alcune immagini sono troppo grandi e si potrebbero ottimizzare con la compressione e servendole con la giusta dimensione.
• Se vengono scaricati troppi mediaperché non pensare di implementare il tanto amato lazy loading?
• Comprimi immagini e video, usa i Video al posto delle GIF, stesso peso, qualità maggiore: Se impostiamo il loop ed il muted nessuno troverà la differenza!

• WebP è il formato del futuro, è sviluppato da Google per le immagini sul web ed offre a parità di qualità un peso del 25–30% inferiore!

1.3.1 Immagini reattive

In ogni sito web ci sarà probabilmente un’immagine che a seconda della risoluzione dello schermo occupa una larghezza diversa all'interno della pagina, ora qui nascono due problemi:
1) scaricare un immagine grande perfetta per la visuale desktop sarà uno spreco per un dispositivo mobile che in media ha 400px di width;
2) le immagini desktop normalmente hanno una visuale orizzontale, quelle mobile per mantenere una buona visibilità dovrebbe avere un orientamento verticale.

Ora se vogliamo mostrare una immagine identica, ma più grande o più piccola in funzione del dispositivo non possiamo usando le immagini standard, che permettono solo di puntare a un singolo file sorgente.
Ma con HTML 5 possiamo usare gli attributi srcset e sizes per fornire diversi url di immagine addizionali per far scaricare un immagine adeguata al device:

Come funziona:

• Il browser verifica della larghezza del suo dispositivo
• Calcolo di quale sia la condizione tra la lista dell’attributo sizes ad essere vera
• Vede quale slot occupa l’immagine da media queries.
• Caricamento dell’immagine elencata nell’attributo srcset che più si avvicina alla dimensione della posizione (slot) scelta

1.4 Sfruttare la cache

Grandi file hanno bisogno di molto tempo e banda per il download, evitiamo di riscaricarli ogni volta. Per ogni file attualmente si fa una richiesta al server, più richieste si fanno al server più questo sarà carico di lavoro, con la cache lo teniamo leggero e pronto a lavorare per cose più importanti.

Alcune regole:

• Leverage browser caching: si utilizza per le risorse statiche e permette quando qualcuno visita la pagina di un sito, di scaricare dal server i file del tipo indicato salvandone una copia nel browser per evitare di scaricarle di nuovo se si dovesse tornare in quella pagina. è semplice da implementare, ecco un esempio per Apache:

• Local Databases: Se stiamo sviluppando una web app che usa un dataset che non cambia molto spesso perché non provare a salvare una copia di questi dati direttamente nel nostro browser? Sebbene siano largamente supportati dai browser ci sono molte librerie che si possono trovare online per rendere semplice lo sviluppo e l’interazione con il database, oltre al supporto cross browser.

1.4.1 PouchDb: Local DB

Il local database che ho personalmente usato con cui mi sono trovato davvero bene è PouchDb, è semplice da installare e funziona bene quasi dappertutto, inoltre c’è la possibilità di sincronizzare i dati con un nostro db online ogni tot.

Come funziona:

• NoSQL e JavaScript ready, se avete usato MongoDb sarà come tornare a casa, non dovrete imparare nulla.
• Scarica i dati e salvali in locale per non fare chiamate ridondanti
• Hai a disposizione le classiche operazioni CRUD (create, read, update, delete) tramite libreria usando delle API simili a Firebase / Mongoose
• Possibilità di sync con database online con CouchDb

Conclusione

Abbiamo imparato come ottimizzare un sito web possa essere importante per aumentare la platea, le conversioni ed i guadagni. Attraverso alcune semplici tecniche possiamo ottenere dei risultati straordinari, e le usiamo in fase di sviluppo possiamo anche “ottimizzare” i tempi.

Ora non abbiamo davvero più scuse per lasciare i nostri siti web in balia delle brutte abitudini! Noi ci rivediamo presto con il proseguo della serie su come ottimizzare i siti web.

Questo articolo fa parte di una serie:

• L’arte di ottimizzare i siti web — Parte 1 — Entry Level: https://medium.com/@ilasw/larte-di-ottimizzare-i-siti-web-parte-1-328378f8a9be
• L’arte di ottimizzare i siti web - Parte 2 -Medium Level: https://medium.com/@ilasw/larte-di-ottimizzare-i-siti-web-parte-2-medium-level-f48fb45fb202

Premessa

Vivo in Sicilia, una terra piena di cultura e tradizioni, che ultimamente è tristemente nota per il fenomeno migratorio dei giovani che volano via ogni anno in cerca di lavoro all’estero.

Qui non c’è un futuro lavorativo per loro. Secondo una rilevazione del 2017 la Sicilia è nella top 10 delle regioni europee per la disoccupazione giovanile (ossia chi tra i 15 e i 24 anni non studia e non lavora) che qui si attesta al 52,9%. Riassumendo ogni anno parte un quantitativo di giovani che basterebbe a formare un paese (10.000+) mentre chi resta ha una probabilità su due di finire a casa a non far nulla.

Enrando nel particolare vivo nella città di Catania, che se dovesse essere rappresentata con una sindrome sicuramente sarebbe quella della personalità multipla. Qui abbiamo una delle più grandi università del sud, insieme ad una popolazione che non sa cosa sia l’educazione; abbiamo uno degli aeroporti internazionali più trafficati d’Italia, ma la maggior parte dei cittadini non parla inglese; si trova in una regione retrograda, ma ospita un buon ecosistema tecnologico-imprenditoriale tra multinazionali che da sempre investono nel territorio (Enel, Tim, ecc..), eccellenze tecnologiche come STMicroelectronics, università ed accademie, acceleratori di imprese.

Io di mestiere faccio lo sviluppatore e non passa giorno in cui non ringrazio per avere la passione per la programmazione che mi ha permesso di entrare in questo mondo fin da giovanissimo, mondo in cui vuoi o non vuoi è difficile, ad oggi, rimanere senza un lavoro.

Sembra strano eh? Ma in un posto in cui una persona su due non trova lavoro c’è un mestiere per cui trovare dei professionisti disoccupati è praticamente impossibile. Anzi, al contrario, ci sono aziende che lottano tra loro per ottenere quei pochi programmatori che sono disponibili su piazza, rimanendo la maggior parte delle volte a bocca asciutta.

Quando mi sono diplomato ho frequentato un corso presso un’azienda di Acireale, che tramite vendite online fattura diversi milioni ogni anno, per diventare uno sviluppatore WordPress (un sistema per la gestione dei blog online). Questo corso è durato più di un mese e per noi partecipanti era totalmente gratuito ed è stato realizzato per poter formare persone che potessero essere assunte in azienda dato che in Sicilia non erano presenti sviluppatori formati per lavorare su questo software.

Questo accade perché il mondo delle imprese, grazie al digitale, si evolve ad una velocità impressionante e per fortuna c’è un ecosistema che favorisce la nascita di imprese che corrono sui binari dell’innovazione, un tipo di rotaia dove non è presente l’attrito del contesto sociale. Qui valgono le potenzialità dei singoli di aprirsi ad un mercato affamato di competenze e desideroso di trovare nuovi prodotti per migliorare la vita delle persone.

Ma questa è una storia di paradossi e non di favole dal lieto fine e se ci sono tante aziende che vorrebbero assumere per competere nel mercato digitale globale, ci deve pur essere un problema no? Il problema è che più del 40% delle aziende digitali in Italia non riesce a trovare persone da assumere per i ruoli cercati; che qui non ci sono persone preparate per svolgere i nuovi lavori richiesti; qui se parli di Social Media o di Data Analyst la maggior parte delle persone crede si tratti di una supercazzola.

Allora ti arrabbi perché la tua azienda vorrebbe crescere e contribuire alla rinascita di un territorio che senza giovani rischia di morire e non trova persone da assumere. Ma allo stesso tempo molti dei tuoi coetanei sono volati via in cerca di fortuna e molti altri sono fermi in un impasse del non-lavoro.

Guardandoci indietro ci deve essere stato un momento in cui qualcosa si è rotto, un momento in cui si è smesso di guardare al futuro e ci si è fossilizzati solo nel presente. Perché le persone non sanno che c’è un mondo del lavoro nel campo del digitale? Perché non ci sono persone preparate per accedervi? Che ruolo giocano le università e le istituzioni in questo campo?

Non tocca a me rispondere, ma una cosa mi preme, se stai leggendo questo piccolo sfogo sappi che ci sono alcune community ed aziende in questa città come in altre che hanno voglia di fare, così come tanti giovani, cerchiamo di non far spegnere un fuoco che sta cercando di divampare.

Update

Dopo la scrittura di quest’articolo ho co-fondato, nel 2019, con altri giovani The Wave Studio che vuole essere un’isola felice per chi vuole mettere in pratica le proprie competenze in un’ambiente sereno e amichevole, per cui puoi sentirti libero di contattarci se vuoi conoscere meglio la nostra realtà.

Lascio anche qualche altro riferimento per la mia città:

• Startup Catania, pagina che tratta di eventi legati al mondo statup/digitale nella nostra città: https://www.facebook.com/startupcatania/
• Youth Hub, community in cui giovani appassionati d’innovazione e con un forte spirito imprenditoriale si incontrano per condividere, sviluppare, e realizzare le proprie idee.: https://www.facebook.com/youthhubcatania/
• Google Developer Group, Sostiene ed anima una community di appassionati di informatica, vita digitale e tecnologie Google in cerca di un ambiente sano dove poter crescere ed esprimere se stessi nel nome della condivisione e dell'aiuto reciproco: https://www.facebook.com/gdgcatania/
• TIM WCAP, acceleratore di startup e spazio per l’innovazione, ospita eventi inerenti al mondo dell’innovazione: https://www.facebook.com/groups/454645481297154/