Tutti i corsiTutti gli articoli
Flutter: la più completa guida introduttiva sul framework cross-platform per sviluppare app

Flutter: la più completa guida introduttiva sul framework cross-platform per sviluppare app

Aggiornato il19.apr.2022/Fudeo.it/44 minuti

## Indice dei contenuti

Questa è la guida introduttiva a Flutter più completa che potrai trovare sul web.

Dopo che l’avrai letta, oltre a sapere cos’è Flutter, avrai ben chiaro il motivo per cui si sta diffondendo così velocemente, conoscerai la sua storia, i suoi competitor e com’è tecnicamente strutturato.

Insomma, avrai tutti gli strumenti per decidere se questo framework cross-platform fa per te.

Nel caso preferissi la versione video di questo articolo, clicca qui (per guardarla gratis, crea un account Fudeo).

Senza perdere tempo, partiamo dalle basi:

cosa significa cross-platform? (più avanti approfondiremo anche il concetto di framework).

Per cross-platform intendiamo la possibilità di sviluppare, in contemporanea, e con un unico codice, applicazioni per piattaforme diverse.

Nel caso di Flutter abbiamo la possibilità di sviluppare ed eseguire app Flutter, senza dover riscrivere il codice ogni volta, per 4 piattaforme:

  • Android

  • iOS

  • per creare siti internet e web app

  • per creare applicazioni desktop (sia per Windows che per MacOS e Linux)

Esatto, é il sogno proibito di molti sviluppatori (e aziende):

un solo codice per tutte queste piattaforme significa poter risparmiare tempo e costi di sviluppo, creare progetti molto più mantenibili e quindi non impazzire nel gestire più basi di codici dello stesso progetto (solitamente ogni piattaforma ha il suo linguaggio di programmazione).

L’obiettivo di Flutter è quello di unificare lo sviluppo per tutte queste piattaforme, offrendoci un solo linguaggio di programmazione, ovvero Dart, ed un solo framework per costruire interfacce grafiche, ovvero Flutter.

E ci sta riuscendo alla grande!

Entriamo più nel dettaglio e analizziamo le piattaforme supportate da Flutter, soffermandoci sulle caratteristiche.

## Flutter per App Android

Cominciamo con Android, piattaforma che tutti conosciamo e che conta il 73% del mercato globale degli smartphone.

Niente male per un solo sistema operativo.

Le applicazioni Flutter girano nativamente su Android (tra poco vedremo cosa intendiamo con nativo), permettendoci di usare Flutter senza alcun timore per il 99% delle casistiche che ci potrebbero venire in mente.

Abbiamo inoltre il supporto aggiornato al Material Design, grafica ormai diventata iconica per il suo utilizzo massiccio di card, ombreggiature e semplicità (anche se con il passare delle versioni, fino ad arrivare alla versione 3, abbiamo un’inversione di tendenza verso colori pastello più caldi e meno in stile industriale).

Flutter supporta il material design attraverso una libreria, già presente in automatico all'interno di Flutter, chiamato per l'appunto Material e costantemente aggiornata da Google.

## Flutter per App iOS

iOS è il sistema operativo degli smartphone di casa Apple ed anche in questo caso abbiamo un supporto nativo di questa piattaforma e della sua grafica, ormai diventata un punto di riferimento per quanto riguarda semplicità e user-experience.

Così come per Android, anche per iOS abbiamo delle applicazioni pressoché native, con pari performance (se non superiori).

Tutte le applicazioni che andremo a realizzare con Flutter, sia per Android che per iOS, girano tranquillamente sia su mobile che sui dispositivi Tablet.

Cosa significa in soldoni?

Che le app per iPhone potranno essere rese disponibili anche per iPad senza alcun problema.

Infine, anche nel caso di iOS abbiamo delle linee guida dal punto di vista del design, che nel caso della Apple è detto HUMAN DESIGN; la libreria equivalente in Flutter è chiamata Cupertino.

## Flutter per App Web e Desktop

Veniamo ora ad un aspetto interessante di Flutter ed ancora poco conosciuto, ovvero il fatto che Flutter possa essere utilizzato anche per sviluppare applicazioni per il Web e Desktop!

### Flutter Web

Nel caso di Futter Web questa nuova piattaforma è considerata ormai stabile da Marzo 2021:

quando esportiamo un’app Flutter per il Web abbiamo che quest'app gira tranquillamente sui maggior browser, sfruttando sia il JavaScript che il WebAssembly.

Ora, nel caso del JavaScript sappiamo che è il linguaggio di programmazione usato dai browser per aggiungere interazione ai siti web.

Meno persone conoscono, però, WebAssembly.

WebAssembly è un linguaggio di programmazione di basso livello che funge da Assembly per il mondo Web, ovvero quasi da linguaggio macchina.

Assembly è infatti presente nei sistemi operativi che tutti noi usiamo ed il WebAssembly non è altro che una ri-formulazione di questo concetto per il mondo Web.

Il vantaggio di WebAssembly è di essere estremamente performante.

Sai cosa implica questo?

Comuni applicazioni solo desktop come Photoshop o giochi sviluppati con motori grafici come UnrealEngine sono ormai in procinto di porting verso il mondo Web, grazie proprio a questo linguaggio.

Insomma, presto potremo giocare nativamente a giochi tripla A nel browser ed usare software come CAD per la modellazione grafica.

Flutter sfrutta questa stessa tecnologia quando compila per il Web , utilizzando un mix di JavaScript e WebAssembly per assicurarsi ottime prestazioni grafiche.

### Flutter Desktop

Per finire non poteva mancare Flutter Desktop, piattaforma per la quale siamo super entusiasti e su cui vediamo tantissimo potenziale.

Ok, usciamo allo scoperto:

siamo fanatici delle applicazioni Desktop ben fatte; la maggior parte pesano gigabyte e rallentano tutto il computer ( qualcuno ha detto Slack? ) e, in generale, non sopportiamo tutte quelle applicazioni basate su Electron che ci forzano a scaricare un browser solamente per gestire una todo list.

Scusaci lo sfogo.

Il problema principale del mondo desktop è che è ancora più frammentato del mondo mobile, avendo 3 principali sistemi operativi ( Windows, MacOS e Linux ), contro i due del mobile.

Inoltre, per rincarare la dose, gli attuali framework per lo sviluppo cross-platform ( come Electron, Nw.js e QT ) lasciano tanto a desiderare, ad essere clementi.

Ecco, quindi, che Flutter diventa uno strumento eccezionale per sviluppare velocemente applicazioni Desktop di qualità.

Alt!

Ovviamente non è tutto rose e fiori:

Flutter Desktop presenta ancora alcuni bug da risolvere e, soprattutto, manca dello stesso supporto e garanzia di affidabilità che Flutter per mobile, invece, possiede.

Detto questo, Flutter per MacOS e Linux (in particolare Ubuntu) è considerato stabile e ben implementato, tanto che Ubuntu stessa consiglia ufficialmente Flutter come framework per sviluppare le sue applicazioni desktop.

Nel caso di Windows, il discorso è differente:

manca ancora una certa stabilità del framework e, in questo caso, e non consigliamo di utilizzare Flutter per sviluppare applicazioni commerciali complesse (per app più semplici non ci sono problemi).

Dal punto di vista grafico, per il mondo Desktop abbiamo a disposizione 4 temi:

  • Material Design e Cupertino, che già conosciamo e che sono i due temi principali del mondo mobile;

  • Per Windows è presente una libreria esterna che implementa le linee guida descritte dalla Fluent UI;

  • Per Linux, ed in particolare Ubuntu, è disponibile Yaru, che segue le linee guida della Canonical (la compagnia madre di Ubuntu).

  • Noi utilizziamo, praticamente per qualsiasi progetto, il MaterialDesign come base per sviluppare app in Flutter, indipendentemente dalla piattaforma, che sia Android, iOS, per il Web o Desktop.

## La storia di Flutter

Abbiamo promesso che alla fine di questa guida saprai tutto ciò che devi sapere su Flutter, quindi non possiamo dare un contesto storico con qualche accenno alle minestrone del progetto.

Google ha pubblicato la prima versione alpha di Flutter nel 2017 e il suo utilizzo (ed il mondo open source che lo circonda) è letteralmente esploso.

Si, hai capito bene, Google.

Flutter è passato, in un solo anno, da versione alpha, considerata sperimentale e non adatta all'utilizzo in produzione, ad una versione stabile e ricca di funzioni, utilizzato da grandi compagnie per integrazioni di nuove funzionalità in applicazioni già in produzione o per svilupparne di completamente nuove.

Nel marzo del 2021 è stata rilasciata la versione 2 del framework, portando numerose novità e celebrando alcuni traguardi raggiunti:

principalmente l'aggiornamento del linguaggio di programmazione alla base di Flutter, ovvero Dart, alla versione con i nullable types.

Inoltre Flutter Web è stato dichiarato stabile e Flutter Desktop è passata ufficialmente in beta.

Dopo di che hanno deprecato alcuni pulsanti, come il RaisedButton (ndr, probabilmente perché si annoiavano) ed hanno migliorato ulteriormente le performance delle applicazioni.

Tra i traguardi raggiunti sicuramente quelli che ci hanno colpito di più durante la presentazione ufficiale sono state le 150.000 applicazioni Flutter pubblicate sugli Store, che la dice lunga sulla stabilità e capacità di questo framework, oltre all’annuncio di alcune grosse compagnie (come Canonical di Ubuntu, BMW e Toyota) che hanno deciso di investire in maniera massiccia in Flutter.

Presentazione dell'app di BMW sviluppata in Flutter

― Presentazione dell'app di BMW sviluppata in Flutter

## Le alternative a Flutter

Una cosa che non dovrebbe stupire nessuno è che Flutter abbia dei competitor.

Non è il primo arrivato, fatto che spiega il suo rapido successo:

così come ha fatto Facebook con MySpace, Flutter ha potuto imparare dagli errori dei predecessori.

Soffermiamoci in particolare sulle alternative di Flutter in ambito mobile, dato che é la nostra specializzazione.

Iniziamo con il dire che uno sviluppatore può scegliere tra quattro principali opzioni.

### Flutter VS Progressive Web App

Le progressive web app non sono altro che dei siti internet, quindi sviluppati con HTML, CSS e JavaScript, un po' particolari, perché sfruttano alcune API per permettere all'utente di aggiungerle alla schermata di home dello smartphone ed interagire con loro come se fossero delle vere e proprie app.

In parole povere, sono a tutti gli effetti dei siti web camuffati da app mobile.

Qui sotto abbiamo un tipico flusso per aggiungere una progressive web app alla propria schermata di home in Android.

Dalla guida ufficiale di Chrome Developers

― Dalla guida ufficiale di Chrome Developers

Possiamo notare come, da browser, la web app rileva che è attualmente in esecuzione nel browser di un telefono e, di conseguenza, mostra un popup per chiedere di aggiungerla alla schermata di home.

Questo è facoltativo, ma nel caso l'utente decidesse di aggiungerla ecco che comparirebbe tra la lista delle applicazioni installate, con una sua icona personalizzata che noi come sviluppatori possiamo indicare in un file, chiamato manifest.

All'avvio la progressive web app presenta una schermata di splash, ovvero di caricamento, anche questa personalizzabile, che è la terza che vediamo nell'immagine riportata sopra come esempio.

Una volta aperta possiamo notare che non è più in esecuzione all'interno del browser, infatti non abbiamo più la barra degli indirizzi per cambiare url, ma sembra un’applicazione nativa a tutti gli effetti.

Di fatto, questo è un ottimo e semplice approccio per rendere disponibile una versione mobile della propria web app, senza doverne sviluppare realmente una.

Il vantaggio di una progressive web app è, dunque, la possibilità di gestire con un unico progetto ed un unico codice, sia un’applicazione per il web che una mobile.

Essendo che la progressive web app non è altro che una web app, ovvero un nome carino per dire "sito internet con JavaScript", dobbiamo utilizzare questo linguaggio per scriverla, magari attraverso un framework come React ed utilizzando TypeScript per avere un linguaggio un attimo meglio di JavaScript per gestire dei progetti complessi, ma ciò non di meno significa che dipendiamo dall'ecosistema JavaScript.

Ora qui si apre una grossissima parentesi sulla qualità, pro e contro di questo ecosistema.

Abbiamo esperienza diretta in progetti da mantenere formati da oltre 100.000 righe di codice e 50 librerie, che ci hanno insegnato quanto attenti bisogna essere alla fragilità di questo ecosistema, continuamente in evoluzione e cambiamento, ed è decisamente un punto a sfavore.

Di positivo c'è che l'ecosistema è estremamente grande, variegato e supportato.

Ma, ritornando alle progessive web app, possiamo affermare senza problemi che è molto difficile ottenere un look&feel da applicazione nativa e, punto non meno importante, le performance sono tutt'altro che al pari di quelle native, il che non si nota per semplici applicazioni, ma diventa un problema per grandi progetti.

Degna di nota è la mancanza di accesso ad alcune API, ovvero funzionalità che, invece, le applicazioni native hanno, come l'accesso al NFC o ai contatti del telefono.

Come ciliegina sulla torta, la Apple ha deciso di proibire già da qualche anno le progressive web app dal suo App Store, lasciando Google Play come unico canale in cui poterle distribuire.

In conclusione, le progressive web app sono efficaci nel caso in cui si abbia una certa urgenza nel distribuire una versione mobile di una web app, con poco budget e per progetti di ridotte dimensioni (spesso viene usata come soluzione provvisoria).

### Flutter VS Ionic

Ionic é un framework che ci offre un insieme di componenti già costruiti, con una grafica estremamente simile a quelle dei componenti nativi e che, semplicemente, produce delle progressive web app.

Utilizzando questo framework invece delle semplici progressive web app, si risolvo principalmente due problemi:

  • l’accesso a delle API native, come quelle per l'utilizzo del NFC e per accedere ai contatti della rubrica

  • le app Ionic sono ammesse anche sull' Apple Store, permettendoci quindi di sviluppare effettivamente delle app per dispositivi mobile con tecnologie Web.

Confronto dell'interesse tra Ionic e Flutter

― Confronto dell'interesse tra Ionic e Flutter

Quindi, i contro quali sono?

Il problema è che Ionic è dipendente dall'ecosistema JavaScript, inoltre le grafiche che si possono sviluppare non sono al pari di quelle native, così come le performance, senza alcun dubbio non paragonabili a quelle delle applicazioni native.

### Flutter VS React Native

Rullo di tamburi.. ci siamo, tocca al principale competitor di Flutter, ovvero React Native!

Prima, una piccola parentesi:

Per completezza nominiamo anche Xamarin di Microsoft, che non andremo ad approfondire perché, semplicemente, non lo consiglieremmo neanche al nostro peggior nemico. Comunque utilizza una strategia simile a React Native, ecco il motivo per cui lo nominiamo proprio adesso.

Bene, dicevamo il principale competitor di Flutter.

React Native, nonostante sia molto simile sotto diversi punti di vista, ha una particolarità che la distingue da Ionic:

sia nel caso di Ionic che nel caso di React viene utilizzato il framework ReactJS;

la differenza rispetto a Ionic, che non faceva altro che sfruttare una WebView (ovvero un browser dentro un’applicazione nativa per renderizzarsi), React Native ha una fase di compilazione, durante la quale traduce in maniera automatica i componenti React che noi abbiamo usato nel nostro codice negli equivalenti componenti nativi.

Quindi possiamo immaginare un’applicazione React Native come del tutto nativa, che però viene sviluppata usando ReactJS e non Java o Swift, come nello sviluppo nativo vero e proprio.

Ciò va a risolvere del tutto due problemi che le soluzioni precedenti hanno, ovvero le performance, che in questo caso sono realmente native, ed il look&feel, dato che i componenti che React Native usa sono quelli nativi.

React Native rappresenta quindi un’ottima scelta per sviluppare applicazioni native, sopratutto nel caso in cui si conosca già ReactJS.

Confronto dell'interesse tra React Native e Flutter

― Confronto dell'interesse tra React Native e Flutter

Nonostante ciò, preferiamo Flutter per sviluppare applicazioni mobile e diciamo questo da sviluppatori che utilizzano quotidianamente ReactJS:

il vantaggio di usare un framework improntato quasi totalmente sul mondo mobile e con un ecosistema cosi grande ci porta a scegliere sempre Flutter per lo sviluppo di app Mobile e Desktop mentre ReactJS per lo sviluppo di Web app.

Insomma, il consiglio è di utilizzare il giusto martello per il giusto chiodo, come si suol dire.

### Flutter VS App Native

Concludiamo l’analisi delle alternative a Flutter con la soluzione più comune, anche se con il tempo sta cedendo il passo allo sviluppo cross-platform:

lo sviluppo di applicazione native.

Il problema principale di questa scelta è il fatto di dover sviluppare la stessa applicazione due volte, essendo che ogni piattaforma, ovvero Android ed iOS, usando linguaggi di programmazione diversi e framework per la grafica diversi.

Questo non solo fa lievitare i costi di sviluppo, ma anche quelli di mantenimento e di velocità di risoluzione di bug, oltre che di implementazione di nuove funzionalità.

Pensiamo ad esempio a colossi come Facebook o Uber che, seppur abbiano abbondantemente il budget per lo sviluppo di due applicazioni, hanno scelto di andare cross-platform con React Native, proprio per semplificare le procedure di mantenimento e sviluppo dei propri servizi.

Il vantaggio indubbio che le applicazioni native continuano a mantenere sono le performance e le API di sistema che hanno a disposizione.

Immaginiamo una casistica molto semplice per spiegare questo concetto al meglio:

Apple implementa i chip neurali per la realtà aumentata e permette alle sue applicazioni di fare 3d rendering con la fotocamera.

Le applicazioni native supporterebbero, ovviamente, tutto questo dal giorno zero. Con Flutter, se tutto andasse per il meglio, bisognerebbe attendere almeno un mese.

Detto questo, la nostra scelta ricade ancora su Flutter, di seguito spiegheremo il motivo.

## Perché scegliamo Flutter

Analizziamo quali sono i punti di vantaggio di Flutter rispetto a tutte le altre alternative:

  • ci permette di utilizzare un unico linguaggio di programmazione, ovvero Dart, un linguaggio moderno con parecchie caratteristiche da linguaggio funzionale, un type system elaborato e una standard library ampia e ben strutturata;

  • ci permette di creare un solo progetto e di scrivere il codice una sola volta;

  • ci permette di compilare e creare non solo applicazioni per Android ed iOS, il che è già fantastico, ma anche per il Web e Desktop.

Tutto questo mantenendo sempre un look&feel da applicazioni mobile e performance pari, se non superiori (e vedremo successivamente il perchè) a quelle native.

Ovviamente le app Flutter vengono accettate da Apple per la pubblicazione su App Store.

Inizi a capire perché Flutter ha avuto una rapidissima diffusione ed è sempre più adottato da sviluppatori e aziende?

Entriamo ancora più nel dettaglio e scopriamo insieme come Flutter riesce a portare tutti questi benefici.

### Flutter e il motore grafico Skia

In breve, il vantaggio di Flutter sta tutto nelle tecnologie che ha adottato alla sua base:

le applicazioni Flutter vengono renderizzate graficamente grazie ad un motore grafico detto Skia, che tutti noi utilizziamo quotidianamente, essendo alla base di Chrome e Firefox.

Ogni volta che noi visualizziamo una pagina Internet all'interno di uno di questi due browser, tutta la grafica che vediamo disegnata sullo schermo è opera di Skia.

Il vantaggio è immediatamente chiaro:

Skia è stato ottimizzato nel corso di anni ed è estremamente veloce.

Come framework, Skia è scritto in C e C++, esattamente come altri motori grafici (ad esempio, Unreal Engine in ambito videogiochi).

Il codice scritto per Skia viene mostrato nello stesso modo all'interno di app Flutter

― Il codice scritto per Skia viene mostrato nello stesso modo all'interno di app Flutter

Per rendere meglio il concetto delle sue potenzialità, possiamo pensare a Skia come un motore grafico che, al posto di disegnare grafica di videogiochi, disegna pagine Internet e grafiche di applicazioni.

Tutto ciò rende Skia un motore grafico leggero e veloce.

Ora, il punto è questo:

essendo che Flutter utilizza Skia per renderizzare graficamente tutte le applicazioni, otteniamo che le performance delle applicazioni Flutter sono molte volte pari, se non superiori, a quelle native.

### Flutter: JIT e AOT

Due acronimi di cui devi saperne il significato per comprendere al meglio Flutter, JIT e AOT:

ovvero, due modi di compilare un linguaggio di programmazione in linguaggio macchina.

Partiamo dal primo.

JIT sta per Just In Time ed è tipico dei linguaggi interpretati come Python, JavaScript e PHP.

La compilazione JIT ha il vantaggio di compilare molto velocemente, tuttavia questo porta ad una diminuzione delle performance del programma, nel nostro caso dell'applicazione.

Per questo motivo, la compilazione JIT viene utilizzata da Flutter solamente durante lo sviluppo, per fare Hot Reload, ovvero per aggiornare la nostra applicazione in tempo reale mentre scriviamo codice.

La compilazione JIT è presente in Flutter grazie a Dart, il linguaggio di programmazione alla base di Flutter, poiché implementa anche questo tipo di compilazione.

Il motivo è storico:

Dart, con la prima versione rilasciata nel 2011, era nato per essere un sostituto in tutto e per tutto di JavaScript e inizialmente utilizzava questo tipo di compilazione.

Recap sui punti importanti della compilazione JIT

― Recap sui punti importanti della compilazione JIT

Successivamente, quando Dart si è evoluto, diventando un linguaggio staticamente tipato, gli sviluppatori hanno comunque mantenuto la compilazione Just in time, andando però ad aggiungere anche un compilatore Ahead of Time.

La compilazione Ahead of Time è tipica dei linguaggi compilati (come C e C#) e possiamo pensarla come l'opposto della compilazione Just in Time:

la modalità AOT prevede la compilazione del nostro codice in linguaggio macchina, creando un binario da eseguire.

Questo porta enormi benefici dal punto di vista della performance, ma non si presta per essere utilizzato durante la fase di sviluppo, quindi non è per niente adatto al Hot Reload.

Il motivo?

Perché la fase di compilazione in modalità AOT impiega diversi secondi (o interi minuti) a compilare tutto il codice di un’app. Mentre, con la compilazione JIT il compilatore ricompila solamente le linee di codice che sono effettivamente cambiate, quindi solamente qualche centinaio.

La compilazione Ahead of Time é presente in Dart dal 2018, ovvero da quando gli sviluppatori hanno smesso di vedere Dart come rimpiazzo di JavaScript ed hanno invece cominciato ad orientarlo come linguaggio di programmazione verso lo sviluppo di applicazioni con Flutter.

Recap sui punti importanti della AOT

― Recap sui punti importanti della AOT

## Cos'è un framework

Finora ci siamo spesso riferiti a Flutter come un framework per lo sviluppo di applicazioni mobile, ma che cos'è un framework di preciso?

Possiamo pensare ad un framework come una sovrastruttura di una libreria o, per dirla in maniera più semplice, come a una libreria molto grande che ci permette di costruirci sopra il nostro software.

Immaginiamo una libreria come un insieme di funzioni raccolte all'interno di uno o più file che esegue operazioni specifiche e ben definite, come la gestione delle date, la comunicazione con un database o la gestione di chiamate HTTP.

Un framework è ugualmente un insieme di funzioni raccolte all'interno di file, come nel caso della libreria, però il cui scopo è quello di facilitarci la creazione di applicazioni sopra di lui.

In che modo ci facilita lo sviluppo?

Costringendoci a strutturare il nostro codice seguendo delle linee guida decise dal framework e offrendoci delle librerie già pronte per risolvere specifiche necessità.

Tieni presente che, molte volte, viene offerto un vero e proprio ecosistema di librerie scritte appositamente per integrarsi con il framework, proprio come le migliaia di librerie di Flutter.

Quindi, ricapitoliamo:

Flutter sarà alla base di tutte le nostre applicazioni, essendo un framework, su cui sopra ci andremo a costruire, utilizzando all’occorrenza anche delle librerie esterne, ad esempio per gestire chiamate HTTP, la connessione al database locale SQLite oppure per criptare delle password.

## Com'è strutturato il framework di Flutter

Il framework di Flutter é composto principalmente da tre livelli.

Prima però, é importante che tu abbia ben in mente perché é fondamentale capire com’è strutturato il framework di Flutter:

ti sarà utile per avere la padronanza sulla struttura del tuo codice e su come estendere le funzionalità di Flutter con codice nativo.

Ad esempio, quando avrai bisogno di interfacciarti con un database o GoogleMaps o, ancora, nel caso in cui dovrai integrare Flutter in un’app nativa.

Ma andiamo con ordine.

Panoramica dell'architettura di Flutter

― Panoramica dell'architettura di Flutter

Al primo livello troviamo il codice che noi andremo scrivere per la nostra applicazione e tutte le librerie Flutter e Dart che andremo a utilizzare, che siano interne (come le librerie Material per la grafica ed i componenti di default) o esterne (come, ad esempio, una libreria che implementa un componente grafico specifico).

Di fatto, é il livello che uno sviluppatore utilizza nel 95% dei casi.

Al secondo livello, che è un po' il nucleo, troviamo il motore di Flutter.

Qui all'interno abbiamo sia il motore grafico che disegna tutte le nostre applicazioni sullo schermo, ovvero SKIA, sia tutto un insieme di servizi per far funzionare Flutter correttamente, come il Dart Runtime o i canali di comunicazione con il codice nativo, indispensabili per interfacciarsi con le API native e, quindi, con le funzionalità native del dispositivo, come ad esempio l'NFC.

Infine, il terzo livello è quello più basso che possiamo trovare all'interno del framework di Flutter, in cui abbiamo principalmente codice nativo che permette alle nostre applicazioni Flutter di sfruttare appieno tutte le funzionalità del dispositivo e di poterla esportare per distribuirla sugli store.

## Dart, il linguaggio di programmazione alla base di Flutter

Concludiamo questa lunga guida introduttiva con Flutter tornando a ciò che sta alla base di Flutter stessa:

Dart, il linguaggio di programmazione.

### Cos'è Dart

Dart è un linguaggio di programmazione molto semplice e estremamente familiare a tutti quei sviluppatori che hanno già familiarità con linguaggi come Java e C#.

Dart, infatti, è un linguaggio ad oggetti, ciò significa che si utilizza massicciamente il concetto di classe e di ereditarietà, ma allo stesso tempo ci permette di utilizzare dei costrutti funzionali, come il map e il filter su liste, l'utilizzo di lambda ed altro ancora.

Cosa comporta questo?

In breve, ci permette di scrivere meno codice e in maniera più dichiarativa anziché imperativa.

### Accenno alla storia di Dart

Dart è stato inventato da Google per sostituire JavaScript come linguaggio di programmazione nel browser:

la prima versione è stata rilasciata nel 2011 e, dato che doveva servire per sostituire JavaScript come linguaggio di programmazione nel browser, era senza tipi, ovvero dinamica.

Dash, la mascotte del linguaggio Dart e del framework Flutter

― Dash, la mascotte del linguaggio Dart e del framework Flutter

Per eseguire del codice Dart all'interno del browser gli sviluppatori avevano creato la Dart Virtual Machine, un concetto già familiare agli sviluppatori Java e C#.

Questa Dart Virtual Machine, che possiamo immaginare come una scatola nera che prende del codice Dart e lo esegue, veniva inclusa in automatico all'interno delle versioni di Chrome di quell'epoca e compilava il codice Dart in modalità JIT.

Google si aspettava che anche altri browser, come Mozilla Firefox ed Internet Explorer, avrebbero adottato questa Dart Virtual Machine, ma così non fu.

Forse anche per colpa, o merito, del progetto TypeScript di Microsoft, che venne impostato anch’essi come linguaggio di programmazione migliore di JavaScript, ma, a differenza di Dart che invece si proponeva come completo sostituto, ancora compatibile JavaScript.

Dopo il fallimento della prima versione di Dart, gli sviluppatori di Google decisero di rivedere totalmente il progetto, collaborando a stretto contatto con gli sviluppatori del framework di Flutter, che stava nascendo nello stesso periodo.

Questo ha portato, nel 2018, al rilascio della seconda versione di Dart, che presentava dei cambiamenti drastici al linguaggio di programmazione:

prevedeva l'utilizzo di tipi, diventato così un linguaggio staticamente tipato.

Dart è oramai principalmente utilizzato all'interno del framework di Flutter, anche se è comunque possibile creare delle command line interface (ovvero dei mini-programmi da eseguire all'interno del terminale) oppure per creare dei server che espongono delle API, direzione che reputiamo molto interessante e che probabilmente ci riserverà delle sorprese in futuro.

La versione 2 di Dart ha segnato anche un passaggio del compilatore dalla modalità JIT alla modalità AOT, il che ha portato numerosi benefici dal punto di vista delle performance.

Tuttavia gli sviluppatori di Dart hanno comunque mantenuto il compilatore JIT e quindi Dart si ritrova ad avere due compilatori diversi:

Come anticipato nella sezione specifica su JIT e AOT, la modalità JIT viene utilizzata durante lo sviluppo di applicazioni Flutter mentre la modalità AOT viene utilizzata per l'esportazione e la pubblicazione delle applicazioni sugli store.

## Conclusioni

Speriamo di essere stati esaustivi e di averti dato tutte le info necessarie per farti un’idea chiara di cos’è Flutter e delle sue potenzialità.

Fudeo é nato nel 2019, agli albori di Flutter, proprio perché, intuite le potenzialità, ci siamo decisi a voler favorire e velocizzare la diffusione di questo framework tra gli sviluppatori italiani.

Con questa guida introduttiva ci auguriamo di aver aggiunto uno strumento in più in favore alla nostra missione.

Noi, come migliaia di altri sviluppatori in tutto il mondo, siamo entusiasti di questo framework e crediamo sinceramente che, con il tempo, diventerà ancora e sempre di più una competenza in grado di impattare in maniera sostanziale sul nostro lavoro.

Il numero di aziende che hanno adottato Flutter (o vorrebbero farlo) sono tante e in costante crescita.

Sicuramente c’è più richiesta di quanto il mercato degli sviluppatori riesca a offrire e questa é una grande opportunità.

Per qualsiasi dubbio o richiesta, clicca sull'icona gialla che trovi in basso a destra su questa pagina per aprire la Live Chat o cercaci su LinkedIn o Facebook, sarà un piacere risponderti per noi.

Ti auguriamo il meglio per la tua carriera,

il team Fudeo.

Vuoi iniziare la tua avventura in Flutter?

Che tu abbia esperienza o meno nello sviluppo di app poco importa, su Fudeo troverai il giusto corso per diventare un Flutter Developer: inizia subito!