Blog – 16.02.2018 Cos’è una Progressive Web App (PWA) e perché dovrebbe interessarmi?

Come hai trovato la strada per questo post del blog, probabilmente hai sentito il termine PWA da qualche parte. Buon per te – le PWA sono ciò per cui sarà ricordato l’anno 2018, quindi sei proprio sul filo del rasoio. Che emozione! In questo post sul blog, ti spiego cosa significa effettivamente il termine e perché dovresti interessartene.
Progressive Web App

Progressive Web App

(fonte: sito Google Developer)

Cos’è una PWA?

PWA sta per Progressive Web Application. Esaminiamola dividendola in due parti. Le ultime due parole (“Web Application”) parlano da sole. Le PWA sono applicazioni web. Qui, applicazione web significa semplicemente un’app che funziona come un sito web come, per esempio, Twitter. La prima parte del termine – Progressive – significa che l’esperienza dell’utente viene migliorata gradualmente in base alle capacità del browser. Essenzialmente questo significa che l’applicazione web funziona bene nei vecchi browser, ma può utilizzare le nuove tecnologie per migliorare l’esperienza se l’utente sta usando un browser che le supporta. Sembra semplice, vero? Quindi da dove viene il termine?

Progressivo significa che l’esperienza dell’utente viene migliorata gradualmente in base alle capacità del browser

Il termine è stato introdotto dall’ingegnere di Google Chrome Alex Russell nel suo post sul blog nel 2015. Da allora, Google ha promosso attivamente il loro utilizzo e ha fornito un sacco di risorse sull’argomento, come un sito che li spiega in modo più dettagliato.
Mentre faccio presentazioni sulle PWA incontro sempre la stessa confusione a questo punto. “Quindi… è una tecnologia? È uno standard? È qualcosa di proprietà o brevettato da Google?”. No, nessuno di questi. È semplicemente un termine per descrivere un modo specifico di progettare e costruire applicazioni. Poi, cerchiamo di capire cosa sono passando attraverso le caratteristiche.
Ecco le 9 caratteristiche originali delle PWA di Alex Russell con una spiegazione su cosa significano in questo contesto:

  • Responsive: La pagina appare bene su schermi di diverse dimensioni (ad esempio telefono, tablet, desktop)
  • Indipendente dalla connettività: Funziona senza connessione a Internet
  • Interazioni simili alle applicazioni: Look’n’feel dell’applicazione nativa
  • Fresh: Sempre aggiornato
  • Sicuro: Utilizza la connessione sicura per mitigare diversi tipi di minacce alla sicurezza
  • Discoverable: I browser identificano automaticamente le PWA
  • Re-engageable: Può riportare gli utenti all’app usando, per esempio, le notifiche Push
  • Installabile: Può essere memorizzata nella schermata iniziale proprio come le app native, ma senza il fastidio extra dell’App Store
  • Linkable: Può essere condiviso come semplice URL

Per il lettore di questo post del blog le funzionalità più importanti sono:

  • Installabile sulla schermata iniziale
  • Accesso a più API native come la fotocamera, la geolocalizzazione, la vibrazione, i pagamenti ecc.
  • Supporto per notifiche Push
  • Uso off-line
  • Supporto per schermo intero e splash screen

(fonte: Alex Russell’s blog post)

Per concludere tutto quanto sopra, le PWA possono fare la maggior parte delle cose che le app native possono fare e il divario tra ciò che le app native e quelle web possono fare sta diventando sempre più stretto.

Perché ora?

A questo punto potreste pensare che tutto questo suona così bene che ci deve essere una fregatura dato che le PWA non sono il modo predefinito di implementare le applicazioni. Sì, avete ragione. C’è una fregatura. C’è stata una mancanza di supporto per le tecnologie che potenziano le PWA in alcuni ambienti. Il supporto di Android esiste da un po’, a partire da Android 5, il che significa che oltre l’80% (fonte: statistiche Android di Google) dei dispositivi Android in tutto il mondo supporta le tecnologie necessarie per implementare le PWA. L’adozione è ancora maggiore se si considera solo l’Europa o il Nord America. Quindi il supporto di Android è già molto buono.
Purtroppo, l’altro giocatore chiave che si divide il mercato dei telefoni cellulari non è stato troppo desideroso di implementare le tecnologie (leggi perché). Il supporto di iOS è stato assente, impedendo così una più ampia adozione delle PWA. Ma a partire dal prossimo iOS 11.3, il supporto sarà disponibile anche per iOS. Fortunatamente l’adozione di nuove versioni di iOS è relativamente veloce, quindi si può supporre che un alto livello di supporto sarà disponibile entro la fine dell’anno. Per riferimento, le versioni 10 e 11 rappresentano il 93% di tutte le versioni iOS utilizzate là fuori secondo Apple.
Mentre l’attenzione quando si parla di PWA è spesso in ambiente mobile, esse funzionano anche per il desktop. All’inizio di questo mese c’è stato un importante annuncio da parte di Microsoft che afferma che le PWA sono ora supportate da Edge e Windows 10. Chrome e Firefox supportano già le PWA e lo stesso farà la prossima versione di Safari per desktop.

Esempio: Twitter Lite

L’esempio più famoso di PWA è la versione PWA di Twitter chiamata Twitter Lite (provala con Android o desktop su mobile.twitter.com). Twitter ha anche pubblicato il loro ragionamento dietro la costruzione della versione PWA. Per evidenziare alcuni dei fatti dal post, rispetto alla loro app nativa, la dimensione della versione PWA è solo 1-3% e il tempo medio di caricamento è del 30% in meno.
Altri esempi noti di PWA includono Forbes, Trivago, Washington Post, Telegram, Alibaba e più recentemente Google Maps Go. C’è anche una directory di PWA disponibile.

Conclusioni

Il 2018 dovrebbe essere l’anno delle PWA. La strumentazione è già ad un grande livello e sempre più PWA stanno spuntando in continuazione. Una volta che il supporto in iOS è altamente disponibile, le PWA diventano un’opzione realistica per le app native. Nel caso stiate valutando se le PWA sono la scelta giusta per voi, tornate presto a controllare, perché scriverò una guida su Dovrei fare una PWA invece di un’app nativa?
Gofore ha già esperienza sulle PWA e possiede anche una vasta esperienza nella costruzione di web app responsive, di grande aspetto, offline-first ed efficienti. Se avete bisogno di aiuto nelle scelte architettoniche, nel design o nell’implementazione delle PWA, non esitate a contattarci.

ALTRE LETTURE DAL BLOG DI GOFORE

Trasformazione Agile in azione – Parte 1
Trasformazione Agile in azione – Parte 2
Che senso ha scalare Agile

Lascia un commento

Il tuo indirizzo email non sarà pubblicato.