Overview
Breviario Mariano è una Progressive Web App costruita attorno a un requisito non negoziabile: funzionare perfettamente anche senza connessione internet. Ho implementato un'architettura offline-first tramite un Service Worker scritto da zero, senza dipendenze da librerie come Workbox, con strategie di caching differenziate per tipo di risorsa: precaching degli asset statici all'installazione, cache-first per immagini e icone, network-first con fallback su cache per la navigazione, e stale-while-revalidate per JS/CSS. Il risultato è un accesso immediato ai contenuti anche in aree senza rete, con build e ottimizzazione degli asset gestite da Vite.
Il cuore del progetto è il motore che determina dinamicamente quale preghiera e quale ora canonica proporre, basandosi sull'ora corrente del dispositivo e su un algoritmo deterministico legato alla data per variare contenuti e antifone. Tutta la logica, testi liturgici, calcolo dell'ora, selezione dei contenuti, è client-side al 100% e vive in un JSON locale: nessuna dipendenza da API esterne, nessun backend, nessuna richiesta di rete necessaria per pregare.
L'interfaccia, costruita in React 19 con animazioni GSAP, è sobria e pulita, progettata per la massima leggibilità in qualsiasi condizione di luce: scala tipografica calibrata, contrasto elevato e navigazione touch-friendly tra le ore canoniche. Come PWA installabile su Android e iOS, offre un'esperienza vicina a un'app nativa senza passare dagli store.
Breviario Mariano raggiunge un punteggio Lighthouse di 99/100 su Performance su desktop e 89/100 su mobile, validato da Google PageSpeed Insights in produzione. Su desktop il First Contentful Paint è a 0,7 secondi, il Largest Contentful Paint a 0,8 secondi, il Total Blocking Time a 0 ms e il Cumulative Layout Shift a 0. Su mobile i valori restano ottimi: FCP a 2,9 secondi, LCP a 3,1 secondi, TBT a 0 ms e CLS a 0. Risultati ottenuti con un Service Worker custom per il caching offline, code splitting con Vite e caricamento non bloccante delle risorse.
Desktop
MobileFAQ
- Che cos'è Breviario Mariano?
- Breviario Mariano è una Progressive Web App (PWA) gratuita per pregare l'Ufficio della Beata Vergine Maria e le Ore Canoniche direttamente dal browser, senza bisogno di installare un'app da store.
- Breviario Mariano funziona senza connessione internet?
- Sì. L'app usa un Service Worker custom, scritto da zero senza librerie di terze parti, che precarica i contenuti statici e mette in cache i testi liturgici al primo avvio. Le strategie di caching sono differenziate per tipo di risorsa: precaching all'installazione, cache-first per le immagini, network-first con fallback per la navigazione. Il risultato è la possibilità di pregare anche in aree senza rete o in modalità aereo.
- Con quali tecnologie è stata sviluppata l'app?
- Il frontend è realizzato in React 19, con Vite come build tool e GSAP per le animazioni. Il funzionamento offline è gestito da un Service Worker scritto interamente da zero, senza librerie di terze parti per il caching. Tutti i testi liturgici sono salvati in un JSON locale.
- Serve creare un account per usare Breviario Mariano?
- No. L'app non richiede registrazione, login né connessione a servizi esterni: tutti i testi liturgici sono salvati localmente e la logica di visualizzazione gira interamente sul dispositivo dell'utente.
- Breviario Mariano si può installare come un'app nativa?
- Sì, essendo una PWA può essere installata su Android e iOS direttamente dal browser tramite la funzione 'Aggiungi a Home', senza passare da Google Play o App Store, e si comporta come un'app installata a tutti gli effetti.
- Come vengono scelte le preghiere e le ore da mostrare?
- Un motore client-side calcola l'ora canonica corrente in base all'orario del dispositivo e seleziona in modo deterministico antifone e descrizioni del giorno da un set di contenuti liturgici predefiniti, senza chiamate a servizi esterni. Tutta la logica è contenuta nel bundle dell'app e funziona completamente offline.
- I dati dell'utente vengono raccolti o inviati a server esterni?
- No. Non essendoci backend né API esterne, non c'è raccolta o trasmissione di dati personali: l'intera esperienza resta sul dispositivo.
- Che differenza c'è tra Breviario Mariano e un'app nativa da store?
- Funzionalmente l'esperienza è equivalente: installabile, icona in home, utilizzo offline completo. La differenza è nell'assenza dei vincoli di pubblicazione e aggiornamento degli store: gli aggiornamenti vengono distribuiti via web e recepiti automaticamente dal Service Worker, senza che l'utente debba fare nulla.
Client Review
Lavorare con Alessandro é stato fantastico, mi è bastato dare il materiale cartaceo, qualche breve e necessaria informazione sul prodotto finito, come colori, stile, tipo di formato finale, e lui ha colto subito tutto al volo con estrema precisione, e si è messo all'opera per realizzare ciò che vedete, ad eccezione di qualche infimo ritocco. Questo dimostra non solo la sua non comune capacità di tradurre nel mezzo i desideri del cliente, ma denota a mio piccolo avviso una spiccata sensibilità e una profonda empatia di base non comuni. Grazie Alessandro!!!