Gebruik SQLite om al uw opslagbehoeften op internet efficiënt af te handelen.
Over SQLite
SQLite is een populair, open-source , lichtgewicht, ingebed relationeel databasebeheersysteem. Veel ontwikkelaars gebruiken het om gegevens op een gestructureerde, gebruiksvriendelijke manier op te slaan. Vanwege het kleine formaat en de lage geheugenvereisten wordt SQLite vaak gebruikt als database-engine op mobiele apparaten, desktopapplicaties en webbrowsers.
Een van de belangrijkste kenmerken van SQLite is dat het een serverloze database is, wat betekent dat er geen afzonderlijk serverproces voor nodig is. In plaats daarvan wordt de database in één bestand op het apparaat van de gebruiker opgeslagen, waardoor deze eenvoudig in applicaties kan worden geïntegreerd.
SQLite gebaseerd op Web Assembly
Er zijn een aantal niet-officiële SQLite-versies gebaseerd op Web Assembly (Wasm), waardoor deze in webbrowsers kan worden gebruikt, bijvoorbeeld sql.js . Het sqlite3 WASM/JS-subproject is de eerste poging die officieel is geassocieerd met het SQLite-project, waarbij Wasm-builds worden gemaakt van de gevestigde bibliotheekleden van de familie van ondersteunde SQLite-producten. De concrete doelstellingen van dit project zijn onder meer:
- Het binden van een sqlite3 API op laag niveau die qua gebruik zo dicht mogelijk bij de C ligt.
- Een objectgeoriënteerde API op een hoger niveau, meer vergelijkbaar met implementaties in sql.js en Node.js-stijl, die rechtstreeks spreekt met de API op laag niveau. Deze API moet worden gebruikt vanuit dezelfde thread als de low-level API.
- Een op Worker gebaseerde API die via Worker-berichten met de vorige API's spreekt. Deze is bedoeld voor gebruik in de hoofdthread, waarbij de API's op een lager niveau zijn geïnstalleerd in een Worker-thread, en om met hen te praten via Worker-berichten.
- Een op Promise gebaseerde variant van de Worker API die de cross-thread communicatieaspecten volledig verbergt voor de gebruiker.
- Ondersteuning voor permanente opslag aan de clientzijde met behulp van beschikbare JavaScript-API's, waaronder het Origin Private File System (OPFS).
SQLite Wasm gebruiken met de persistentie-backend van het Origin Private File System
De bibliotheek installeren vanaf npm
Installeer het @sqlite.org/sqlite-wasm- pakket van npm met de volgende opdracht:
npm install @sqlite.org/sqlite-wasm
Het Origin privébestandssysteem
Het Origin Private File System (OPFS, onderdeel van de File System Access API ) is uitgebreid met een speciaal oppervlak dat zeer performante toegang tot gegevens biedt. Dit nieuwe oppervlak verschilt van de bestaande doordat het interne en exclusieve schrijftoegang biedt tot de inhoud van een bestand. Deze verandering, samen met de mogelijkheid om consequent niet-doorgespoelde wijzigingen te lezen en de beschikbaarheid van een synchrone variant op speciale werkers, verbetert de prestaties aanzienlijk en deblokkeert nieuwe gebruiksscenario's.
Zoals u zich kunt voorstellen, gaat het laatste punt van de doelstellingen van het project, Ondersteuning voor persistente opslag aan de clientzijde met behulp van beschikbare JavaScript API's, gepaard met strikte prestatie-eisen met betrekking tot het persistent maken van gegevens in het databasebestand. Dit is waar het Origin Private File System, en meer specifiek de methode createSyncAccessHandle() van FileSystemFileHandle objecten, in het spel komt. Deze methode retourneert een Promise die wordt omgezet in een FileSystemSyncAccessHandle object dat kan worden gebruikt om synchroon te lezen van en te schrijven naar een bestand. Het synchrone karakter van deze methode brengt prestatievoordelen met zich mee, maar is daarom alleen bruikbaar binnen speciale Web Workers voor bestanden binnen het Origin Private File System, zodat de hoofdthread niet kan worden geblokkeerd.
Het instellen van de vereiste headers
Het gedownloade SQLite Wasm-archief bevat naast andere bestanden de bestanden sqlite3.js en sqlite3.wasm , waaruit de sqlite3 WASM/JS-build bestaat. De jswasm map bevat de kernproducten van sqlite3 en de map op het hoogste niveau bevat demonstratie- en test-apps. Browsers leveren geen Wasm-bestanden aan vanaf file:// URL's, dus alle apps die u hiermee bouwt vereisen een webserver en die server moet de volgende headers opnemen in zijn reactie bij het aanbieden van de bestanden:
-
Cross-Origin-Opener-Policyingesteld op desame-originrichtlijn , die de browsecontext uitsluitend isoleert voor documenten van dezelfde oorsprong. Cross-origin-documenten worden niet in dezelfde browsercontext geladen. -
Cross-Origin-Embedder-Policyis ingesteld op derequire-corprichtlijn , zodat een document alleen bronnen van dezelfde oorsprong kan laden, of bronnen die expliciet zijn gemarkeerd als laadbaar vanaf een andere oorsprong.
De reden voor deze headers is dat SQLite Wasm afhankelijk is van SharedArrayBuffer , en het instellen van deze headers is onderdeel van de beveiligingsvereisten .
Als u het verkeer met DevTools inspecteert, zou u de volgende informatie moeten vinden:
Snelheidstest
Het SQLite-team heeft een aantal benchmarks uitgevoerd voor hun WebAssembly-implementatie in vergelijking met de verouderde Web SQL. Uit deze benchmarks blijkt dat SQLite Wasm over het algemeen ongeveer net zo snel is als Web SQL. Soms is het een beetje langzamer, soms is het een beetje sneller. Bekijk alle details op de resultatenpagina .
Aan de slag met codevoorbeeld
Zoals eerder vermeld, moet SQLite Wasm met de persistentie-backend van Origin Private File System worden uitgevoerd vanuit een Worker-context. Het goede nieuws is dat de bibliotheek dit allemaal automatisch voor je regelt en dat je het rechtstreeks vanuit de hoofdthread kunt gebruiken.
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
Zie de bovenstaande code in actie in de demo . Zorg ervoor dat je de broncode op Glitch bekijkt. Merk op dat de onderstaande ingebedde versie de OPFS-backend niet gebruikt, maar wanneer u de demo op een apart tabblad opent, doet dit dat wel.
Fouten opsporen in het privébestandssysteem van Origin
Om de Origin Private File System-uitvoer van SQLite Wasm te debuggen, gebruikt u de OPFS Explorer Chrome-extensie.
Nadat u de extensie hebt geïnstalleerd, opent u Chrome DevTools, selecteert u het tabblad OPFS Explorer en bent u klaar om te inspecteren wat SQLite Wasm naar het Origin Private File System schrijft.
Als u op een van de bestanden in het OPFS Explorer-venster in DevTools klikt, kunt u deze op de lokale schijf opslaan. Vervolgens kunt u een app als SQLite Viewer gebruiken om de database te inspecteren, zodat u er zeker van kunt zijn dat SQLite Wasm ook daadwerkelijk werkt zoals beloofd.
Hulp krijgen en feedback geven
SQLite Wasm is ontwikkeld en wordt onderhouden door de SQLite-gemeenschap. Krijg hulp en geef feedback door te zoeken en berichten te plaatsen op het ondersteuningsforum . De volledige documentatie is beschikbaar op de SQLite-site.
Dankbetuigingen
Heldenafbeelding door Tobias Fischer op Unsplash .