Quando la tua PWA inizia a parlare

Utilizzo di WaveNet per aggiungere la sintesi vocale per gli articoli

Di cosa parliamo quando parliamo di discorso

Dopo aver impostato la traduzione automatica di tutti i miei articoli in varie altre lingue, ho iniziato a pensare a quale prossima funzionalità moderna e utile avrei potuto implementare. Poiché sarai assolutamente d'accordo sul fatto che leggere i miei post sia una delle esperienze più piacevoli, ho pensato che l'utilizzo di un servizio di sintesi vocale automatica potesse migliorare ancora di più la UX dell'articolo. Pertanto, il piano era semplice: aggiungerò una nuova azione all'inizio del testo di un articolo che consente agli utenti di ascoltarlo tramite il lettore audio del browser.

Come: sintesi vocale speech

Dopo aver esaminato l'architettura dell'app corrente, è stato implementato il seguente flusso di lavoro per migliorare la PWA con sintesi vocale automatica e un lettore audio:

  1. implementare la sintesi tramite il servizio text-to-speech di GCP utilizzando l'opzione WaveNet (molto) più costosa invece di quella standard
  2. memorizzare il file mp3 creato in Firebase Storage, un semplice file system anch'esso ospitato in GCP; il nome del file è costituito dallo slug dell'articolo e dalla localizzazione utilizzata, che mi dà un ID implicito ed evita l'aggiunta di un documento separato che mantiene il riferimento a tutti gli URL per un determinato discorso
  3. quindi chiamo i due passaggi precedenti sul server Vercel durante la creazione o l'aggiornamento di una pagina di articolo, che attualmente avviene ogni 24 ore al massimo
  4. utilizzando il caricamento lento per il web player nel caso in cui sia disponibile un URL audio

Essere pigri è importante

Non voglio danneggiare le prestazioni di caricamento delle mie applicazioni web (e di conseguenza il posizionamento nei motori di ricerca), quindi il web player viene caricato su richiesta solo dopo che sono soddisfatte due condizioni:

  • È effettivamente disponibile un URL audio per l'articolo, che attualmente si applica solo ai testi in inglese per contenere principalmente i costi
  • Un utente fa clic sul pulsante di riproduzione, indicando il desiderio di ascoltare effettivamente l'articolo letto ad alta voce

Perché non tutte le lingue (per ora)?

A causa dell'utilizzo di WaveNet di Google come modello di sintesi vocale effettivo, devo considerare i costi per questa funzione come un punto di preoccupazione principale. L'utilizzo di WaveNet costa quattro volte il modello di sintesi standard. Eppure l'ho scelto perché WaveNet supera di gran lunga la maggior parte degli altri modelli, non solo di Google stesso ma anche di IBM, per esempio.

Solo l'inizio

Questa è stata una rapida panoramica di come ho implementato la sintesi vocale in una prima versione per questa PWA. Il tempo per codificare ha richiesto solo poche ore, poiché stavo già effettuando la maggior parte della configurazione essendo un cliente GCP. L'output generato suona incredibilmente bene, il che mostra i punti di forza di WaveNet e degli approcci basati su ML al parlato e alla gestione del testo. Una futura implementazione potrebbe aggiungere la lettura ad alta voce per tutte le lingue supportate. In base all'utilizzo e ai costi nei prossimi mesi, determinerò come procedere in questo caso.

Tom