Mit SQLite können Sie all Ihre Speicheranforderungen leistungsfähig im Web erledigen.
Informationen zu SQLite
SQLite ist ein beliebtes, einfaches Open-Source-, eingebettetes relationales Datenbankverwaltungssystem. Viele Entwickler verwenden es, um Daten auf strukturierte und benutzerfreundliche Weise zu speichern. Aufgrund der geringen Größe und des geringen Arbeitsspeicherbedarfs wird SQLite oft als Datenbankmodul in Mobilgeräten, Desktopanwendungen und Webbrowsern genutzt.
Eines der Hauptmerkmale von SQLite ist, dass es eine serverlose Datenbank ist. Das bedeutet, dass für den Betrieb kein separater Serverprozess erforderlich ist. Stattdessen wird die Datenbank in einer einzelnen Datei auf dem Gerät des Nutzers gespeichert, was die Integration in Anwendungen erleichtert.
SQLite auf Basis von Web Assembly
Es gibt eine Reihe inoffizieller SQLite-Versionen, die auf Web Assembly (Wasm) basieren und in Webbrowsern wie sql.js verwendet werden können. Das WASM/JS-Unterprojekt "sqlite3" ist das erste Projekt, das offiziell mit dem SQLite-Projekt verknüpft ist. Wasm erstellt so die Bibliothek, die Mitglieder der unterstützten SQLite-Liefergegenstände sind. Zu den konkreten Zielen dieses Projekts gehören:
- Binden einer Low-Level-Square3-API, die der C-API so ähnlich wie die Nutzung ist.
- Eine übergeordnete objektorientierte API, die sql.js- und Node.js-Implementierungen ähnelt und direkt für die Low-Level-API spricht Diese API muss aus demselben Thread wie die Low-Level-API verwendet werden.
- Eine Worker-basierte API, die über Worker-Nachrichten mit den vorherigen APIs kommuniziert. Diese ist für die Verwendung im Hauptthread bestimmt, wobei die untergeordneten APIs in einem Worker-Thread installiert sind und über Worker-Nachrichten mit ihnen kommuniziert werden.
- Eine auf Promise basierte Variante der Worker API, die die Thread-übergreifenden Kommunikationsaspekte für den Nutzer vollständig verbirgt.
- Unterstützung für nichtflüchtigen clientseitigen Speicher mit verfügbaren JavaScript APIs, einschließlich Origin Private File System (OPFS).
SQLite Wasm mit dem Backend für die Persistenz des privaten Dateisystems verwenden
Bibliothek von npm installieren
Installieren Sie das Paket @sqlite.org/sqlite-wasm von npm mit dem folgenden Befehl:
npm install @sqlite.org/sqlite-wasm
Das private Origin File System
Das Origin Private File System (OPFS, Teil der File System Access API) hat eine spezielle Oberfläche, die einen äußerst leistungsfähigen Zugriff auf Daten ermöglicht. Diese neue Oberfläche unterscheidet sich von vorhandenen Oberflächen, da sie direkten und exklusiven Schreibzugriff auf den Inhalt einer Datei bietet. Durch diese Änderung, zusammen mit der Möglichkeit, nicht bereinigte Änderungen konsistent zu lesen und die Verfügbarkeit einer synchronen Variante auf dedizierten Workern zu prüfen, wird die Leistung erheblich verbessert und neue Anwendungsfälle werden ermöglicht.
Wie Sie sich vorstellen können, bringt der letzte Punkt der Projektziele, der Support für nichtflüchtigen clientseitigen Speicher unter Verwendung der verfügbaren JavaScript APIs, strenge Leistungsanforderungen in Bezug auf die dauerhafte Speicherung von Daten in der Datenbankdatei mit sich.
Hier kommen das private Origin File System und insbesondere die Methode createSyncAccessHandle() von FileSystemFileHandle-Objekten ins Spiel. Diese Methode gibt ein Promise zurück, das in ein FileSystemSyncAccessHandle-Objekt aufgelöst wird, das zum synchronen Lesen aus einer Datei und Schreiben in eine Datei verwendet werden kann. Die synchrone Methode bietet Leistungsvorteile, kann aber nur in dedizierten Web Workers für Dateien innerhalb des privaten Dateisystems des Ursprungs verwendet werden, sodass der Hauptthread nicht blockiert werden kann.
Erforderliche Header festlegen
Das heruntergeladene SQLite Wasm-Archiv enthält unter anderem die Dateien sqlite3.js und sqlite3.wasm, aus denen der WASM/JS-Build von Squarelite3 besteht. Das Verzeichnis jswasm enthält die wichtigsten Squarelite3-Ergebnisse und das Verzeichnis der obersten Ebene enthält Demonstrations- und Testanwendungen. Browser stellen keine Wasm-Dateien von file://-URLs bereit. Daher benötigen alle damit erstellten Anwendungen einen Webserver und dieser Server muss bei der Bereitstellung der Dateien die folgenden Header in seine Antwort aufnehmen:
Cross-Origin-Opener-Policy, das auf die Anweisungsame-origingesetzt ist, die den Browserkontext ausschließlich auf Dokumente mit demselben Ursprung isoliert. Ursprungsübergreifende Dokumente werden nicht im selben Browserkontext geladen.Cross-Origin-Embedder-Policy, die auf die Anweisungrequire-corpgesetzt ist, sodass ein Dokument nur Ressourcen aus demselben Ursprung laden kann, oder Ressourcen, die explizit als zum Laden von einem anderen Ursprung gekennzeichnet sind.
Der Grund für diese Header besteht darin, dass SQLite Wasm von SharedArrayBuffer abhängt. Das Festlegen dieser Header ist Teil der Sicherheitsanforderungen.
Wenn Sie den Traffic mit den Entwicklertools prüfen, sollten Sie die folgenden Informationen finden:
Geschwindigkeitstest
Das SQLite-Team hat einige Benchmarks für seine WebAssembly-Implementierung im Vergleich zum eingestellten Web SQL durchgeführt. Diese Benchmarks zeigen, dass SQLite Wasm im Allgemeinen so schnell ist wie Web SQL. manchmal etwas langsamer, manchmal ein bisschen schneller. Alle Details finden Sie auf der Ergebnisseite.
Codebeispiel für den Einstieg
Wie bereits erwähnt, muss SQLite Wasm mit dem Persistenz-Back-End für das private Dateisystem des Ursprungs in einem Worker-Kontext ausgeführt werden. Die gute Nachricht ist, dass die Bibliothek das automatisch erledigt und Sie sie direkt aus dem Hauptthread verwenden können.
import { sqlite3Worker1Promiser } from '@sqlite.org/sqlite-wasm';
(async () => {
try {
console.log('Loading and initializing SQLite3 module...');
const promiser = await new Promise((resolve) => {
const _promiser = sqlite3Worker1Promiser({
onready: () => {
resolve(_promiser);
},
});
});
console.log('Done initializing. Running demo...');
let response;
response = await promiser('config-get', {});
console.log('Running SQLite3 version', response.result.version.libVersion);
response = await promiser('open', {
filename: 'file:worker-promiser.sqlite3?vfs=opfs',
});
const { dbId } = response;
console.log(
'OPFS is available, created persisted database at',
response.result.filename.replace(/^file:(.*?)\?vfs=opfs$/, '$1'),
);
await promiser('exec', { dbId, sql: 'CREATE TABLE IF NOT EXISTS t(a,b)' });
console.log('Creating a table...');
console.log('Insert some data using exec()...');
for (let i = 20; i <= 25; ++i) {
await promiser('exec', {
dbId,
sql: 'INSERT INTO t(a,b) VALUES (?,?)',
bind: [i, i * 2],
});
}
console.log('Query data with exec()');
await promiser('exec', {
dbId,
sql: 'SELECT a FROM t ORDER BY a LIMIT 3',
callback: (result) => {
if (!result.row) {
return;
}
console.log(result.row);
},
});
await promiser('close', { dbId });
} catch (err) {
if (!(err instanceof Error)) {
err = new Error(err.result.message);
}
console.error(err.name, err.message);
}
})();
Demo
Sehen Sie sich den obigen Code in Aktion in der Demo an. Sieh dir auch den Quellcode auf Glitch an. Beachten Sie, dass die folgende eingebettete Version nicht das OPFS-Back-End verwendet, aber wenn Sie die Demo in einem separaten Tab öffnen, geschieht dies.
Fehlerbehebung im privaten Dateisystem des Ursprungs
Verwenden Sie die Chrome-Erweiterung OPFS Explorer, um Fehler in der Origin Private File System-Ausgabe von SQLite Wasm zu beheben.
Öffnen Sie nach der Installation der Erweiterung die Chrome-Entwicklertools und wählen Sie den Tab OPFS Explorer aus. Sie können dann prüfen, was SQLite Wasm in das private Dateisystem des Ursprungs schreibt.
Wenn Sie in den Entwicklertools im OPFS-Explorer-Fenster auf eine der Dateien klicken, können Sie sie auf der lokalen Festplatte speichern. Anschließend können Sie eine App wie SQLite Viewer verwenden, um die Datenbank zu überprüfen, damit Sie sich sicher sein können, dass SQLite Wasm tatsächlich wie versprochen funktioniert.
Hilfe erhalten und Feedback geben
SQLite Wasm wird von der SQLite-Community entwickelt und gepflegt. Suchen Sie im Supportforum und posten Sie Beiträge im Supportforum, um Hilfe zu erhalten und Feedback zu geben. Die vollständige Dokumentation finden Sie auf der SQLite-Website.
Danksagungen
Hero-Image von Tobias Fischer auf Unsplash