Progressive Web App (PWA): definizione, funzionamento e casi d'uso

Probabilmente hai già usato una progressive web app senza saperlo. Quando un negozio online ti propone « Aggiungi alla schermata Home », l'icona compare sul telefono accanto alle altre applicazioni e all'apertura non ci sono più barra degli indirizzi né schede: quella è una PWA. Tecnicamente sei ancora su un sito web. Nei fatti, stai usando un'applicazione.

Questa guida dà la definizione esatta di progressive web app, spiega che cosa la distingue da un semplice sito responsive, chiarisce che cosa sa fare e che cosa non sa fare — soprattutto su iPhone — e ti aiuta a capire se è il formato giusto per il tuo progetto.

Definizione: che cos'è una progressive web app?

Una progressive web app (PWA) è un'applicazione web, costruita con le tecnologie standard del web (HTML, CSS, JavaScript), che sfrutta le funzionalità moderne del browser per offrire un'esperienza equivalente a quella di un'app mobile: installazione sulla schermata Home, avvio a schermo intero, caricamento rapido, funzionamento parziale offline e notifiche push.

Il termine è stato introdotto da Google nel 2015. L'aggettivo « progressive » deriva dal miglioramento progressivo: la stessa URL funziona ovunque e ogni browser ne sfrutta il massimo. Su un browser datato l'utente vede un normale sito web. Su uno recente ottiene un'applicazione installabile. Non esiste mai una seconda versione da mantenere.

Che cosa distingue una PWA da un sito mobile classico

Un sito responsive si adatta alla dimensione dello schermo, e basta. Una progressive web app aggiunge tre cose che un sito classico non ha: è installabile (ha una propria icona e un proprio avvio), è affidabile (mostra qualcosa di utile anche con connessione instabile o assente) ed è in grado di lavorare in background (notifiche, sincronizzazione).

• Sito responsive: si apre nel browser, dipende dalla rete, nessuna icona, nessuna notifica.
• Progressive web app: si installa, si avvia a schermo intero, tiene i dati in cache, può inviare notifiche.
• App nativa: si scarica da uno store, accede a tutto l'hardware del telefono, sviluppata specificamente per iOS e Android.

Come funziona una progressive web app

Tre elementi trasformano un sito web in progressive web app. Sono indipendenti dal framework, quindi un sito esistente può diventare una PWA senza essere riscritto.

1. Il manifest (web app manifest)

È un piccolo file JSON che descrive la tua applicazione al sistema operativo: nome, nome breve sotto l'icona, icone in più dimensioni, colore del tema, pagina di avvio e modalità di visualizzazione. È ciò che permette al browser di proporre l'installazione e che fa sparire la barra degli indirizzi all'avvio.

2. Il service worker

È il cuore tecnico di una PWA: uno script che gira in background, separatamente dalla pagina, e che fa da intermediario tra applicazione e rete. Intercetta le richieste e decide se servire una versione in cache o recuperare dati aggiornati. È questo che garantisce un caricamento quasi istantaneo al secondo avvio, una schermata utile quando la rete manca e le notifiche push ad app chiusa.

3. L'HTTPS

Un service worker funziona solo su connessione sicura. L'HTTPS quindi non è un'opzione per una progressive web app: è un prerequisito, esattamente come per il posizionamento sui motori di ricerca.

Checklist: i criteri di una vera PWA

Molti siti si presentano come progressive web app senza rispettarne le condizioni. Ecco che cosa verificare prima di usare il termine.

• Il sito è servito interamente in HTTPS.
• È presente un manifest valido, con almeno nome, icona 512×512 e pagina di avvio.
• Un service worker è registrato e gestisce almeno uno scenario offline.
• L'interfaccia è usabile su mobile senza zoom né scorrimento orizzontale.
• Le prestazioni mobili sono sotto controllo (Core Web Vitals: LCP, INP, CLS).
• Ogni schermata importante mantiene una URL pulita e indicizzabile da Google.

I vantaggi concreti di una progressive web app

• Una sola base di codice. Lo stesso prodotto funge da sito web, app Android e app iPhone, invece di tre progetti da finanziare e mantenere.
• Nessun attrito di installazione. L'utente arriva da un link e usa subito l'applicazione. Nessun passaggio dallo store, nessun download da decine di megabyte.
• Aggiornamenti immediati. Pubblichi e tutti hanno la nuova versione al caricamento successivo. Nessuna revisione da attendere, nessun utente bloccato su una versione vecchia.
• Posizionamento preservato. A differenza di un'app nativa, invisibile a Google, una progressive web app resta un sito indicizzabile capace di attrarre traffico di ricerca.
• Nessuna commissione di store. I pagamenti passano dalla tua soluzione web, senza trattenute sugli acquisti in-app.

I limiti da conoscere prima di scegliere

Una progressive web app non è un'app nativa travestita. Tre limiti guidano la decisione.

• L'App Store resta chiuso alle PWA. Apple non accetta una progressive web app inviata così com'è: un'app giudicata priva di funzionalità proprie oltre al sito web viene rifiutata. Su Android, invece, è possibile pubblicare una PWA sul Play Store tramite una Trusted Web Activity. Se la tua acquisizione dipende dalla visibilità sull'App Store, la sola PWA non basterà.
• iOS resta indietro. Le notifiche push web esistono su iPhone da iOS 16.4, ma solo se l'utente ha davvero aggiunto l'applicazione alla schermata Home — un passaggio in più, che Safari valorizza molto meno di quanto faccia Chrome su Android. Diverse API avanzate restano inoltre non disponibili.
• L'accesso all'hardware è parziale. Fotocamera, microfono e geolocalizzazione funzionano bene. Bluetooth, NFC, biometria avanzata, elaborazione video pesante o integrazione profonda con il sistema restano terreno del nativo.

PWA, app nativa o WebView: il confronto

Quando la progressive web app è la scelta giusta

La PWA raramente è un compromesso subito: per un'intera categoria di prodotti è oggettivamente il formato migliore.

• Un MVP o un prodotto da validare in fretta, dove un doppio sviluppo nativo non è giustificabile.
• Uno strumento interno, un portale clienti o un back-office aziendale, che nessuno cercherà mai su uno store.
• Un e-commerce o un servizio di prenotazione, dove ogni passaggio in più prima dell'acquisto abbatte la conversione.
• Un media o un servizio di contenuti, la cui acquisizione si basa sulla ricerca organica.

Al contrario, punta sul nativo se il prodotto dipende da un uso avanzato dell'hardware, da un'esperienza molto animata, oppure se la presenza sull'App Store è il tuo canale di acquisizione principale.

Come creare una progressive web app

Il percorso si riassume in cinque passaggi, in quest'ordine.

• 1. Costruire una base web solida. Interfaccia mobile-first, navigazione chiara, prestazioni curate: una PWA lenta resta un'app lenta.
• 2. Aggiungere il manifest. Nome, icone, colori, modalità di visualizzazione e pagina di avvio.
• 3. Implementare il service worker. Definire che cosa va in cache e che cosa deve arrivare dalla rete, poi progettare la schermata offline.
• 4. Servire tutto in HTTPS. Con un dominio tuo, indispensabile per la fiducia e per il posizionamento.
• 5. Testare su dispositivi reali. Verificare l'installazione su Android e iPhone, il comportamento offline e i Core Web Vitals.

Progressive web app e SEO

È il principale vantaggio strategico del formato: la tua applicazione resta un sito. Ogni pagina mantiene una URL indicizzabile, il proprio title e la propria meta description, e può essere arricchita con dati strutturati. La velocità garantita dalla cache incide direttamente sui Core Web Vitals, che fanno parte dei segnali di esperienza di pagina. Un'app nativa, al contrario, non porta alcuna visibilità nei risultati di ricerca.

Un punto di attenzione: se il contenuto è renderizzato interamente lato client, assicurati che resti accessibile ai crawler. Il rendering lato server o la generazione statica evitano di sacrificare il SEO all'esperienza applicativa.

Dove interviene Cadrant

Con Cadrant descrivi la tua applicazione in linguaggio naturale e ottieni una base web reale e mobile-first, con il codice che ti appartiene. Iteri prompt dopo prompt, pubblichi sul tuo dominio in HTTPS e mantieni un prodotto indicizzabile da Google.

E se il progetto dovesse richiedere una presenza sull'App Store, non resti bloccato: Cadrant genera anche applicazioni mobili con pubblicazione automatizzata (certificato, profilo di firma, build di produzione e invio su App Store Connect). Puoi quindi partire da una progressive web app per validare il mercato e aggiungere il canale store quando diventa redditizio.

Conclusione

Tieni a mente la definizione semplice: una progressive web app è un sito web che si installa e si comporta come un'applicazione. Ti dà un'unica base di codice, posizionamento preservato, aggiornamenti immediati e un costo d'ingresso molto più basso del nativo, al prezzo di un accesso hardware parziale e dell'assenza dall'App Store.

Per la maggior parte dei progetti che partono è il formato più razionale: mette il prodotto nelle mani di utenti reali senza immobilizzare mesi di budget e lascia aperta l'opzione nativa per il giorno in cui sarà davvero giustificata.