JavaScript IndexedDB
IndexedDB ist eine leistungsstarke, clientseitige Speicher-API, die robuster ist als andere in Webbrowsern verfügbare lokale Speicherlösungen. Sie ermöglicht es Webanwendungen, große Mengen strukturierter Daten asynchron zu speichern und zu manipulieren. IndexedDB ist ideal für Anwendungen, die Offline-Datenspeicherung, hohe Leistung und umfangreiche Abfragefunktionen benötigen, ohne auf eine Netzwerkverbindung angewiesen zu sein.
Einrichten einer IndexedDB-Datenbank
Schritt 1: Datenbank öffnen
Um IndexedDB zu verwenden, ist der erste Schritt das Öffnen einer Datenbank. So können Sie eine IndexedDB-Datenbank erstellen oder öffnen. Nach einer erfolgreichen Operation schließen wir die Datenbank, um unerwünschte Nebenwirkungen in anderen Beispielen zu vermeiden. Sie können diesen Schritt in Ihrem eigenen Code überspringen oder bei Bedarf einfügen.
Warnung: Das Aufrufen von deleteDatabase() löscht alle Daten dieser Datenbank. Dies dient nur zu Testzwecken und sollte nicht in der Produktion verwendet werden.
Schritt 2: Erstellen von Object Stores
Sobald die Datenbank geöffnet ist, können Sie mit dem Erstellen eines Object Stores fortfahren, der einer Tabelle in relationalen Datenbanken entspricht. Beachten Sie, dass dies nur während eines Version-Upgrades möglich ist (beim Öffnen der Datenbank mit einer höheren Versionsnummer). Das zu lauschende Ereignis ist onupgradeneeded.
Transaktionen
Sobald Ihre Datenbank und Object Stores eingerichtet sind, müssen Sie Datenoperationen über Transaktionen verwalten. Eine Transaktion in IndexedDB ist ein Mechanismus, der mehrere Operationen zu einer einzigen Arbeitseinheit zusammenfasst, die entweder vollständig erfolgreich ist oder vollständig fehlschlägt. Sie ist entscheidend für die Gewährleistung der Datenkonsistenz und -integrität, insbesondere wenn mehrere Operationen voneinander abhängen, um ein korrektes Ergebnis zu erzielen.
So verwenden Sie Transaktionen in IndexedDB
Schritt 1: Transaktion starten
Um eine beliebige Operation in IndexedDB durchzuführen, beginnen Sie mit dem Erstellen einer Transaktion auf einer Datenbank. Eine Transaktion wird erstellt, indem angegeben wird, welche Object Stores in die Transaktion einbezogen werden und welcher Modus verwendet wird, der entweder "readonly" oder "readwrite" sein kann.
Schritt 2: Zugriff auf einen Object Store
Innerhalb einer Transaktion können Sie auf einen oder mehrere Object Stores zugreifen, um Datenoperationen durchzuführen.
Schritt 3: Operationen ausführen
Sobald Sie Zugriff auf einen Object Store haben, können Sie verschiedene Operationen wie das Hinzufügen, Abrufen, Aktualisieren oder Löschen von Daten ausführen. Jede Operation gibt ein Request-Objekt zurück, das Sie zur Behandlung von Erfolgs- oder Fehlerereignissen verwenden können.
Schritt 4: Transaktion abschließen
Eine Transaktion wird automatisch abgeschlossen, sobald alle darin ausgeführten Operationen aufgelöst wurden, sei es durch Erfolg oder Fehlschlag. Sie können auch das complete-Ereignis der Transaktion abhören, um Aktionen nach dem erfolgreichen Abschluss aller Operationen auszuführen.
Hier ist ein Beispiel für eine vollständige Transaktion:
Daten lesen
Um Daten abzurufen, verwenden Sie store.get(key) oder einen Cursor zum Durchlaufen mehrerer Datensätze. Hier sind schnelle Beispiele:
Abrufen eines einzelnen Datensatzes:
Durchlaufen mit einem Cursor:
Datensätze aktualisieren und löschen
Um vorhandene Daten zu ändern, verwenden Sie store.put() mit demselben Schlüssel. Um Daten zu entfernen, verwenden Sie store.delete(key).
Aktualisieren eines Datensatzes:
Löschen eines Datensatzes:
So zeigen Sie IndexedDB-Inhalte in Ihrem Browser an
Nach dem Speichern und Bearbeiten von Daten möchten Sie möglicherweise prüfen, was tatsächlich in Ihrem Browser gespeichert ist. Die meisten modernen Browser zeigen Ihnen an, was in der IndexedDB gespeichert ist. Unten sehen Sie ein Beispiel aus den Entwicklertools von Chrome:
Best Practices für die Verwendung von Transaktionen
Damit Ihre IndexedDB-Implementierung zuverlässig und leistungsfähig bleibt, befolgen Sie diese Richtlinien:
- Umfang minimieren: Halten Sie Transaktionen so klein wie möglich, sowohl in Bezug auf die Anzahl der Operationen als auch auf die Dauer. Dies verringert die Wahrscheinlichkeit von Konflikten und verbessert die Leistung.
- Fehlerbehandlung: Implementieren Sie immer eine Fehlerbehandlung auf der Request- und Transaktionsebene. Dies hilft bei der Diagnose von Problemen und verhindert teilweise Aktualisierungen, die zu Datenbeschädigungen führen könnten.
- Nebenläufigkeit: Verstehen Sie, dass Transaktionen in derselben Datenbank, obwohl IndexedDB asynchron und nicht blockierend ist, in eine Warteschlange gestellt und seriell ausgeführt werden, um Datenrennen und Inkonsistenzen zu verhindern.
Fazit
IndexedDB bietet eine robuste Plattform für das komplexe Datenmanagement in Webanwendungen und ist damit ein unverzichtbares Werkzeug für moderne Webentwickler. Durch die ordnungsgemäße Implementierung seiner Funktionen können Entwickler clientseitige Daten effizient speichern, abrufen, aktualisieren und löschen, was die Anwendungsleistung und die Benutzererfahrung verbessert.
Praxis
Welche Merkmale hat IndexedDB in JavaScript?