PWA - Le Progressive Web App spiegate in poche righe

Se le Progressive Web App stanno attirando su di loro una certa attenzione è perché si basano sul meglio delle tecnologie attualmente in circolazione: del web da un lato, delle applicazioni native dall'altro, riducendo così un divario epocale.

Fino ad oggi il successo delle applicazioni native è derivato da un fatto ben preciso: si tratta del mezzo migliore per garantire all'utente un'eccellente user experience, sia da una prospettiva visual che dal punto di vista delle funzionalità supportate. Tuttavia questo tipo di tecnologia presenta i suoi  limiti, come ad esempio per quanto riguarda l'indicizzazione (SEO) con conseguenti problemi di "reperibilità", così come lo step dell'installazione obbligatorio visto come un deterrente da alcuni utenti.

Per comprendere meglio le caratteristiche delle Progressive Web App, bisogna iniziare a dare un'occhiata ai princìpi alla base di questo nuovo concetto. Una PWA è: 1) Affidabile, 2) Veloce, 3) Coinvolgente. Alla base di tutto c'è sempre la user experience e un'impostazione generale che mette al centro l'utente. Gli sviluppatori stanno virando dunque su un insieme di tecnologie web, strumenti e best practices che stabiliscono un nuovo standard che riguarda tutti i tipi di dispositivi.

Per introdurti al tema da un punto di visto più tecnico, abbiamo chiamato in causa Jean-Mathieu, sviluppatore Angular qui in GoodBarber.
 

Una prima caratteristica di una Progressive Web App è la sua capacità di funzionare offline. Una volta di più si tratta di mettere l'utente prima di ogni cosa, evitando il solito messaggio di errore in caso di connessione debole o assente.

Per fornire dei contenuti offline all'utente, le PWA si basano su due particolarità: innanzitutto lo 'scheletro' dell'app, che richiama la struttura della pagina, anche se i suoi contenuti non rispondono; i suoi elementi includono l'intestazione, il layout della pagina, così come un'illustrazione che segnala che la pagina sta caricando. In questo modo l'utente viene messo al corrente del fatto che qualcosa sta succedendo. Certamente un passo in avanti rispetto al messaggio di errore in cui l'utente si imbatte oggi giorno con siti web e web app.

Per poter competere con il look and feel delle applicazioni native, il design delle Progressive Web App deve essere necessariamente 'adaptive'. Il responsive è un must per ogni PWA, indipendentemente dal tipo di tecnologia che lo gestisce. Questo garantisce all'utente la transizione da un dispositivo all'altro, con schermi di diverse dimensioni, in modo semplice e senza intaccare minimamente la qualità. Il che rientra nella dimensione dell'affidabilità
 

Inoltre una Web App Progressiva si appoggia su un service worker che permette il caching dei contenuti, non appena l'applicazione viene lanciata per la prima volta. È in questo modo che i contenuti vengono resi disponibili offline.
 

Se l'installazione di un'app nativa può essere considerata come una sorta di insidia (in quanto richiede uno step aggiuntivo da parte dell'utente), le Web App Progressive rendono questo passaggio opzionale. Su mobile e tablet viene richiesto infatti all'utente di installare l'app sulla home screen del dispositivo. Lo step "Install" è abilitato attraverso il manifest dell'app, che fornisce al browser tutte le informazioni: l'icona (per tutti i tipi di dispositivo), lo splash screen, la visualizzazione portrait e landscape e se l'app sta operando autonomamente dal browser.
 

I miglioramenti non finiscono qui: una Web App Progressiva può anche inviare notifiche push, che era appunto uno dei punti chiave a favore delle applicazioni native. Se lo sviluppatore abilita le push per una PWA, questa opera come attività in background del service worker. A partire da questo momento le notifiche push per Web App Progressive sono supportate da Chrome, Firefox, Opera, Safari su desktop ma non su mobile. Un reticenza che può essere interpretata forse come una vera e propria competizione nei confronti delle app native. Ce lo dirà il tempo...
 

Proprio perché le Web App Progressive si basano sul meglio della tecnologia web, finiscono anche loro nell'ambito di una più sicura navigazione web, con l'obbligo di essere serviti da HTTPS. Tra l'altro, con l'HTTPS da poco diventato un requisito per le app iOS, anche se questo dovesse rappresentare lavoro extra per gli sviluppatori, non fermerà di certo la sfida lanciata dalle PWA alle app native.

Se dovessimo isolare ora un elemento chiave che rappresenti al meglio la rivoluzione delle Web App Progressive, questo è sicuramente il service worker: è infatti grazie a 'lui' - come ci ha spiegato Jean-Mathieu - e ai sui task in background che vengono gestite le notifiche push, i contenuti offline, la cache e tutto ciò che permette di trasformare un sito web in una WPA. Tutto questo senza dimenticare il mobile e un look and fell nativo per l'utente.

Se vuoi avere maggiori informazioni relativamente alle Web App Progressive, puoi trovare la checklist di Google a questo link.