Esegui l'upgrade all'SDK web modulare (v9)

Le app che attualmente utilizzano l'SDK web versione 8 o precedente dovrebbero valutare la possibilità di eseguire la migrazione alla versione 9 seguendo le istruzioni riportate in questa guida.

Questa guida presuppone che tu abbia familiarità con la versione 8 e che utilizzerai un bundler di moduli come webpack o aggregazione per l'upgrade e lo sviluppo continuo della versione 9.

Ti consigliamo vivamente di utilizzare un bundler di moduli nel tuo ambiente di sviluppo. Se non ne utilizzi una, non potrai usufruire dei principali vantaggi della versione 9 in caso di dimensioni dell'app ridotte. Per installare l'SDK è necessario npm o yarn.

Informazioni sulle librerie compat

Sono disponibili due tipi di librerie per la versione 9 dell'SDK web:

  • Modulare: una nuova piattaforma API progettata per facilitare la tremolio (rimozione del codice inutilizzato) al fine di rendere la tua app web il più piccola e veloce possibile.
  • Compat: una piattaforma API familiare completamente compatibile con la versione 8, che consente di eseguire l'upgrade alla versione 9 senza modificare tutto il codice SDK contemporaneamente. Le dimensioni e i vantaggi in termini di prestazioni delle librerie Compat sono minimi o nulli rispetto alla versione 8.

Questa guida presuppone che userai le librerie compatibili della versione 9 per facilitare l'upgrade. Queste librerie consentono di continuare a usare il codice della versione 8 insieme al refactoring del codice per la versione 9. Ciò significa che puoi compilare ed eseguire il debug della tua app più facilmente man mano che esegui il processo di upgrade.

Per le app con un'esposizione molto ridotta all'SDK web, potrebbe essere pratico eseguire il refactoring del codice della versione 8 senza utilizzare le librerie di compatibilità della versione 9. Se esegui l'upgrade di un'app di questo tipo, puoi seguire le istruzioni riportate in questa guida per la "versione 9 modulare" senza utilizzare le librerie di compatibilità.

Informazioni sul processo di upgrade

L'ambito di ogni passaggio del processo di upgrade ti consente di completare la modifica dell'origine per l'app, quindi compilarla ed eseguirla senza interruzioni. In sintesi, ecco che cosa devi fare per eseguire l'upgrade di un'app:

  1. Aggiungi le librerie della versione 9 e le librerie compat alla tua app.
  2. Aggiorna le istruzioni di importazione nel codice affinché siano compatibili con la versione v9.
  3. Esegui il refactoring del codice allo stile modulare.
  4. Rimuovi la libreria di controllo di autenticazione e il codice di conformità per l'autenticazione al fine di usufruire dei vantaggi delle dimensioni dell'app.
  5. Aggiorna il codice di inizializzazione allo stile modulare.
  6. Rimuovi dalla tua app tutte le altre istruzioni per la compatibilità della versione 9 e il codice di conformità.

Scarica l'SDK della versione 9

Per iniziare, recupera le librerie della versione 9 e le librerie compatibili utilizzando npm (versione più recente https://www.npmjs.com/package/firebase):

npm i firebase@10.11.1

# OR

yarn add firebase@10.11.1

Aggiorna le importazioni alla versione v9

Per mantenere il codice funzionante dopo l'aggiornamento della dipendenza dalla versione v8 alla versione v9, modifica le istruzioni di importazione in modo da utilizzare la versione "compat" di ogni importazione. Ad esempio:

Prima: versione 8

import firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/firestore';

Dopo: versione 9 compat

// v9 compat packages are API compatible with v8 code
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';

Esegui il refactoring allo stile modulare

Sebbene le API versione 8 si basino su uno spazio dei nomi concatenato a punti e un pattern di servizio, l'approccio modulare della versione 9 prevede che il codice sarà organizzato principalmente in base a funzioni. Nella versione 9, il pacchetto Firebase/app e gli altri pacchetti non restituiscono un'esportazione completa contenente tutti i metodi del pacchetto. ma esportano le singole funzioni.

Nella versione 9, i servizi vengono passati come primo argomento e la funzione utilizza i dettagli del servizio per fare il resto.

Esempio: refactoring di una semplice funzione di autenticazione

Prima: compatibilità versione 9

Il codice di compatibilità della versione 9 è identico al codice della versione 8, ma le importazioni sono cambiate. Usando le librerie compat durante l'upgrade, puoi continuare a usare il codice versione 8 insieme al refactoring del codice per la versione 9.

import firebase from "firebase/compat/app";
import "firebase/compat/auth";

const auth = firebase.auth();
auth.onAuthStateChanged(user => {
  // Check for user status
});

Dopo: modulare versione 9

La funzione getAuth utilizza firebaseApp come primo parametro. La funzione onAuthStateChanged non è concatenata dall'istanza auth come sarebbe nella versione 8; è invece una funzione gratuita che prende auth come primo parametro.

import { getAuth, onAuthStateChanged } from "firebase/auth";

const auth = getAuth(firebaseApp);
onAuthStateChanged(auth, user => {
  // Check for user status
});

Aggiorna codice di inizializzazione

Aggiorna il codice di inizializzazione dell'app per utilizzare la nuova sintassi modulare 9. È importante aggiornare questo codice dopo aver completato il refactoring di tutto il codice nell'app; questo perché firebase.initializeApp() inizializza lo stato globale sia per le API compat che per quelle modulari, mentre la funzione modulare initializeApp() inizializza solo lo stato per l'API modulare.

Prima: compatibilità versione 9

import firebase from "firebase/compat/app"

firebase.initializeApp({ /* config */ });

Dopo: modulare versione 9

import { initializeApp } from "firebase/app"

const firebaseApp = initializeApp({ /* config */ });

Rimuovi codice compatt

Per usufruire dei vantaggi in termini di dimensioni dell'SDK modulare della versione 9, alla fine dovresti convertire tutte le chiamate nello stile modulare mostrato sopra e rimuovere tutte le istruzioni import "firebase/compat/* dal codice. Al termine, non dovrebbero più esserci altri riferimenti allo spazio dei nomi globale firebase.* o a qualsiasi altro codice nello stile dell'SDK versione 8.

Vantaggi e limitazioni della versione 9

La versione 9 completamente modularizzata offre i seguenti vantaggi rispetto alle versioni precedenti:

  • La versione 9 consente di ridurre drasticamente le dimensioni dell'app. Adotta il formato moderno dei moduli JavaScript, che consente l'applicazione di pratiche di "tree shaking" in cui importi solo gli artefatti necessari all'app. A seconda dell'app, lo scuotimento degli alberi con la versione 9 può comportare l'80% di kilobyte in meno rispetto a un'app simile creata con la versione 8.
  • La versione 9 continuerà a beneficiare dello sviluppo continuo delle funzionalità, mentre la versione 8 verrà bloccata in futuro.