Upgrade auf das modulare Web SDK (v9)

Für Apps, die derzeit das Web SDK Version 8 oder älter verwenden, sollte eine Migration zu Version 9 gemäß der Anleitung in diesem Leitfaden in Betracht gezogen werden.

In diesem Leitfaden wird davon ausgegangen, dass Sie mit Version 8 vertraut sind und für Upgrades und laufende Entwicklungen in Version 9 einen Modul-Bundler wie webpack oder Rollup nutzen.

Es wird dringend empfohlen, in Ihrer Entwicklungsumgebung einen Module Bundler zu verwenden. Andernfalls können Sie die Hauptvorteile von Version 9 bei der verringerten Anwendungsgröße nicht nutzen. Sie benötigen npm oder yarn, um das SDK zu installieren.

Über die kompatiblen Bibliotheken

Für Web SDK Version 9 sind zwei Arten von Bibliotheken verfügbar:

  • Modular: Eine neue API-Oberfläche, die das Tree-Stricking (Entfernen von nicht verwendetem Code) erleichtert, um Ihre Webanwendung so klein und schnell wie möglich zu machen.
  • Kompatibel: Dies ist eine bekannte API-Oberfläche, die vollständig mit Version 8 kompatibel ist. Sie können also ein Upgrade auf Version 9 durchführen, ohne den gesamten SDK-Code auf einmal ändern zu müssen. Vergleichsbibliotheken haben im Vergleich zu Version 8 nur wenige oder gar keine Größen- oder Leistungsvorteile.

In diesem Leitfaden wird davon ausgegangen, dass Sie die kompatiblen Bibliotheken der Version 9 für das Upgrade nutzen. Mit diesen Bibliotheken können Sie neben dem für Version 9 refaktorierten Code weiterhin den Code der Version 8 verwenden. Das bedeutet, dass Sie die Anwendung während des Upgradevorgangs leichter kompilieren und debuggen können.

Bei Anwendungen, bei denen das Web SDK sehr wenig gefährdet ist, kann es sinnvoll sein, den Code der Version 8 zu refaktorieren, ohne die kompatiblen Bibliotheken der Version 9 zu verwenden. Wenn Sie ein Upgrade für eine solche App durchführen, können Sie der Anleitung in dieser Anleitung für "Version 9 modular" folgen, ohne die kompatiblen Bibliotheken zu verwenden.

Informationen zur Umstellung

Jeder Schritt des Upgradeprozesses ist begrenzt, sodass Sie die Bearbeitung der Quelle für Ihre Anwendung abschließen, kompilieren und ausführen können. So aktualisieren Sie eine App:

  1. Fügen Sie Ihrer App die Bibliotheken der Version 9 und die entsprechenden Bibliotheken hinzu.
  2. Aktualisieren Sie die Importanweisungen in Ihrem Code auf v9-kompatibel.
  3. Refaktorieren Sie den Code auf den modularen Stil.
  4. Entfernen Sie die Kompatibilitätsbibliothek für die Authentifizierung und den Compat-Code für die Authentifizierung, um die Vorteile der Anwendungsgröße zu nutzen.
  5. Initialisierungscode auf den modularen Stil aktualisieren
  6. Entfernen Sie alle verbleibenden kompatiblen Anweisungen der Version 9 und den kompatiblen Code aus Ihrer App.

SDK für Version 9 herunterladen

Rufen Sie zuerst die Bibliotheken der Version 9 und die Compat-Bibliotheken mithilfe von npm (neueste Version https://www.npmjs.com/package/firebase) ab:

npm i firebase@10.12.3

# OR

yarn add firebase@10.12.3

Importe auf V9-Kompatibilität aktualisieren

Damit Ihr Code nach der Aktualisierung der Abhängigkeit von v8 auf v9 funktioniert, ändern Sie Ihre Importanweisungen so, dass die "kompatible" Version jedes Imports verwendet wird. Beispiel:

Vorher: Version 8

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

Nachher: Version 9-kompatibel

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

Auf den modularen Stil umstellen

Während die APIs der Version 8 auf einem Punkt-Chain-Namespace und einem Dienstmuster basieren, bedeutet der modulare Ansatz der Version 9, dass Ihr Code in erster Linie um Funktionen organisiert ist. In Version 9 geben das Firebase-/App-Paket und andere Pakete keinen umfassenden Export zurück, der alle Methoden aus dem Paket enthält. Stattdessen exportieren die Pakete einzelne Funktionen.

In Version 9 werden Dienste als erstes Argument übergeben. Die Funktion verwendet dann die Details des Dienstes, um den Rest zu erledigen.

Beispiel: Refaktorierung einer einfachen Authentifizierungsfunktion

Vorher: Kompatibilität mit Version 9

Der kompatible Code der Version 9 ist mit dem Code der Version 8 identisch, aber die Importe haben sich geändert. Wenn Sie während des Upgrades die kompatiblen Bibliotheken verwenden, können Sie neben dem für Version 9 refaktorierten Code weiterhin den Code der Version 8 verwenden.

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

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

Nachher: Version 9 modular

Die getAuth-Funktion verwendet firebaseApp als ersten Parameter. Die Funktion onAuthStateChanged ist nicht wie in Version 8 von der Auth-Instanz aus verkettet. Stattdessen handelt es sich um eine kostenlose Funktion, die auth als ersten Parameter verwendet.

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

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

Initialisierungscode aktualisieren

Aktualisieren Sie den Initialisierungscode Ihrer App, um die neue modulare Syntax der Version 9 zu verwenden. Es ist wichtig, diesen Code zu aktualisieren, nachdem Sie den gesamten Code in Ihrer App refaktoriert haben. Dies liegt daran, dass firebase.initializeApp() den globalen Status sowohl für die kompatiblen als auch für die modularen APIs initialisiert, während die modulare initializeApp()-Funktion nur den Status für die modulare API initialisiert.

Vorher: Kompatibilität mit Version 9

import firebase from "firebase/compat/app"

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

Nachher: Version 9 modular

import { initializeApp } from "firebase/app"

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

Kompatiblen Code entfernen

Damit Sie die Größenvorteile des modularen SDK der Version 9 nutzen können, sollten Sie schließlich alle Aufrufe in den oben gezeigten modularen Stil konvertieren und alle import "firebase/compat/*-Anweisungen aus Ihrem Code entfernen. Danach sollten keine weiteren Verweise auf den globalen Namespace firebase.* oder anderen Code im SDK-Stil der Version 8 vorhanden sein.

Vorteile und Einschränkungen von Version 9

Die vollständig modularisierte Version 9 hat gegenüber früheren Versionen diese Vorteile:

  • Version 9 ermöglicht eine deutlich reduzierte App-Größe. Es verwendet das moderne JavaScript-Modulformat und ermöglicht sogenannte Tree Shaking-Praktiken, bei denen Sie nur die Artefakte importieren, die Ihre App benötigt. Je nach Ihrer Anwendung kann das Baumwackeln mit Version 9 zu 80% weniger Kilobyte führen als bei einer vergleichbaren App, die mit Version 8 erstellt wurde.
  • Version 9 wird weiterhin von der kontinuierlichen Funktionsentwicklung profitieren, während Version 8 zu einem späteren Zeitpunkt eingefroren wird.