Utilizza SQLite per gestire con prestazioni elevate tutte le tue esigenze di archiviazione sul web.
Informazioni su SQLite
SQLite è un'applicazione molto diffusa relazionali open source, leggeri e incorporati di gestione dei database. Molti sviluppatori lo usano per archiviare i dati in un strutturata e facile da usare. A causa delle dimensioni ridotte e della memoria insufficiente standard, SQLite viene spesso sfruttato come motore di database nei dispositivi mobili, applicazioni desktop e browser web.
Una delle caratteristiche principali di SQLite è che è un database serverless, significa che non è necessario un processo del server separato per il funzionamento. Invece, il database è archiviato in un unico file sul dispositivo dell'utente, semplificando integrare nelle applicazioni.
SQLite basata su Web Assembly
Esistono diverse versioni SQLite non ufficiali basate su Web Assembly (Wasm), consentendone l'uso nei browser web, ad esempio sql.js. La sqlite3 WASM/JS subproject è al primo tentativo che è ufficialmente associato Progetto SQLite che crea build Wasm della libreria membri consolidati della famiglia di prodotti SQLite supportati. Il cemento di questo progetto includono:
- Associazione di un'API sqlite3 di basso livello il più vicino possibile a quella C termini di utilizzo.
- Un'API orientata agli oggetti di livello superiore, sql.js e implementazioni di tipo Node.js, comunica direttamente con l'API di basso livello. Questa API deve essere utilizzata dalla stessa come API di basso livello.
- Un'API basata su worker che comunica con le API precedenti tramite messaggi del worker. Questo una da usare nel thread principale, con le API di livello inferiore installati in un thread worker e di comunicare con loro tramite messaggi del worker.
- Una variante basata su Promise dell'API Worker che nasconde interamente gli aspetti della comunicazione tra thread da parte dell'utente.
- Supporto per l'archiviazione permanente lato client utilizzando le API JavaScript disponibili. tra cui l'Origin Private File System (OPFS).
Utilizzo di SQLite Wasm con il backend di persistenza del file system privato di origine
Installazione della libreria da npm
Installa il @sqlite.org/sqlite-wasm di npm con il seguente comando:
npm install @sqlite.org/sqlite-wasm
Il file system privato di origine
L'Origin Private File System (OPFS, parte del API File System Access) è aumentata con un una piattaforma speciale che offre un accesso ai dati molto performante. Questa nuova piattaforma si differenzia da quelle esistenti offrendo accesso in scrittura ed esclusivo a un i contenuti del file. Questa modifica, insieme alla possibilità di leggere in modo coerente modifiche non completate e la disponibilità di una variante sincrona persone dedicate, migliora significativamente le prestazioni e sblocca le nuove d'uso diversi.
Come potete immaginare, l'ultimo punto degli obiettivi del progetto, ovvero il
lo spazio di archiviazione permanente lato client utilizzando le API JavaScript disponibili,
severi requisiti di prestazioni per quanto riguarda la conservazione dei dati nel file di database.
È qui che si trova il file system privato di origine e, in particolare, lo
createSyncAccessHandle()
metodo di
FileSystemFileHandle
degli oggetti che entrano in gioco. Questo metodo restituisce una promessa che si risolve in un
FileSystemSyncAccessHandle
che può essere utilizzato per leggere e scrivere in un file in modo sincrono. La
la natura sincrona di questo metodo offre vantaggi in termini di prestazioni, ma
può essere utilizzato solo all'interno
Web worker per
file all'interno del file system privato di origine, in modo che il thread principale non possa essere bloccato.
Impostazione delle intestazioni richieste
Tra gli altri file, l'archivio SQLite Wasm scaricato contiene i file sqlite3.js
e sqlite3.wasm
, che compongono la build sqlite3 WASM/JS. jswasm
che contiene i risultati finali sqlite3 e la directory di primo livello
contiene app dimostrative e di test. I browser non pubblicheranno file Wasm da
file://
URL, quindi tutte le app che crei con questo richiedono un server web e che
il server web deve includere le seguenti intestazioni nella sua risposta durante l'elaborazione
file:
Cross-Origin-Opener-Policy
impostato sul istruzionesame-origin
, che isola il contesto di navigazione esclusivamente in documenti della stessa origine. I documenti multiorigine non vengono caricati nello stesso contesto di navigazione.Cross-Origin-Embedder-Policy
impostato sul istruzionerequire-corp
, in modo che un documento possa caricare solo risorse dalla stessa origine, oppure risorse esplicitamente contrassegnati come caricabili da un'altra origine.
Il motivo di queste intestazioni è che SQLite Wasm dipende
SharedArrayBuffer
,
e l'impostazione di queste intestazioni fa parte
requisiti di sicurezza.
Se ispezioni il traffico con DevTools, dovresti trovare quanto segue informazioni:
Test della velocità
Il team SQLite ha eseguito alcuni benchmark sull'implementazione di WebAssembly rispetto a SQL web deprecato. Questi benchmark mostrano che SQLite Wasm è in genere più veloce di SQL web. A volte è un po' più lento, a volte è un po' più veloce. Leggi tutti i dettagli nella pagina dei risultati.
Esempio di codice per iniziare
Come accennato in precedenza, SQLite Wasm con il file system privato di origine il backend di persistenza deve essere eseguito da un contesto worker. La buona notizia è che la libreria si occupa automaticamente di tutto questo e puoi utilizzarlo direttamente dal thread principale.
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
Guarda il codice riportato sopra in azione nella demo. Assicurati di consultare codice sorgente su Glitch. Nota come la versione incorporata qui sotto non utilizza il backend OPFS, ma quando apri la demo in una scheda separata.
Debug del file system privato di origine
Per eseguire il debug dell'output del file system privato di origine di SQLite Wasm, utilizza Esplora OPFS estensione di Chrome.
Dopo aver installato l'estensione, apri Chrome DevTools, seleziona il file OPFS Explorer per esaminare ciò che SQLite Wasm scrive nella File system privato di origine.
Se fai clic su uno dei file nella finestra Explorer OPFS in DevTools, possono salvarlo sul disco locale. Puoi quindi usare un'app come Visualizzatore SQLite per ispezionare il database, in modo da poter assicurarti che SQLite Wasm funziona effettivamente come promesso.
Ricevere assistenza e fornire feedback
SQLite Wasm è sviluppato e gestito dalla community SQLite. Ricevi assistenza e fornire un feedback cercando e pubblicando forum di assistenza. L'intero documentazione è disponibile sul sito SQLite.
Ringraziamenti
Immagine hero di Tobias Fischer su Rimuovi schermo.