Web'de tüm depolama alanınızı verimli bir şekilde yönetmek için SQLite'i kullanın.
SQLite, popüler, açık kaynak, hafif, yerleşik bir ilişkisel veritabanı yönetim sistemidir. Birçok geliştirici, verileri yapılandırılmış ve kullanımı kolay bir şekilde depolamak için bu aracı kullanır. Küçük boyutu ve düşük bellek gereksinimleri nedeniyle SQLite, genellikle mobil cihazlarda, masaüstü uygulamalarında ve web tarayıcılarında veritabanı motoru olarak kullanılır.
SQLite'in en önemli özelliklerinden biri, sunucusuz bir veritabanı olmasıdır. Bu, çalışması için ayrı bir sunucu işlemi gerektirmediği anlamına gelir. Bunun yerine, veritabanı kullanıcının cihazında tek bir dosyada depolanır. Bu sayede, uygulamalara entegrasyonu kolaylaştırılır.
Web Assembly tabanlı SQLite
Web Assembly'ye (Wasm) dayalı olan ve web tarayıcılarında (ör. sql.js) kullanılmasına izin veren çeşitli resmi olmayan SQLite sürümleri vardır. sqlite3 WASM/JS alt projesi, desteklenen SQLite yayınları ailesinin yerleşik üyelerinin kitaplığından Wasm derlemeleri oluşturan SQLite projesi ile resmi olarak ilişkilendirilen ilk çalışmadır. Bu projenin somut hedefleri şunlardır:
- Kullanım açısından C API'ye olabildiğince yakın olan düşük seviye bir sqlite3 API bağlama.
- Doğrudan düşük düzey API ile iletişim kuran, sql.js ve Node.js tarzı uygulamalara daha yakın olan daha üst düzey bir nesne yönelimli API. Bu API, düşük düzey API ile aynı iş parçacığında kullanılmalıdır.
- Önceki API'lere çalışan mesajları aracılığıyla iletişim kuran çalışan tabanlı bir API. Bu çözüm, ana iş parçacığında alt düzey API'lerin yüklü olduğu bir Worker iş parçacığında kullanılmak ve bu API'lerle Çalışan mesajları aracılığıyla konuşmak için tasarlanmıştır.
- İşçi API'sinin, iş parçacığı arası iletişim özelliklerini kullanıcıdan tamamen gizleyen, Promise tabanlı bir varyantı.
- Kaynak Özel Dosya Sistemi (OPFS) dahil olmak üzere mevcut JavaScript API'lerini kullanarak kalıcı istemci tarafı depolama alanı desteği.
SQLite Wasm'i Origin Private File System kalıcı arka ucu ile kullanma
npm'den kitaplığı yükleme
Aşağıdaki komutu kullanarak npm'den @sqlite.org/sqlite-wasm paketini yükleyin:
npm install @sqlite.org/sqlite-wasm
Kaynak Gizli Dosya Sistemi
Kaynak Özel Dosya Sistemi (File System Access API'nin bir parçası olan OPFS), verilere son derece etkili erişim sağlayan özel bir yüzeyle güçlendirilmiştir. Bu yeni yüzey, bir dosyanın içeriğine yerinde ve özel yazma erişimi sunarak mevcut yüzeylerden farklıdır. Bu değişiklik, temizlenmemiş değişiklikleri tutarlı bir şekilde okuma özelliği ve özel çalışanlarda senkron bir varyantın kullanılabilirliğiyle birlikte performansı önemli ölçüde artırır ve yeni kullanım alanlarının önünü açar.
Tahmin edebileceğiniz gibi, projenin hedeflerindeki son nokta olan mevcut JavaScript API'leri kullanarak istemci tarafında kalıcı depolama desteği, verileri veritabanı dosyasında kalıcı hale getirmeyle ilgili katı performans koşullarıyla birlikte gelir.
Bu noktada, Kaynak Özel Dosya Sistemi ve daha spesifik olarak FileSystemFileHandle
öğelerinin createSyncAccessHandle()
yöntemi devreye girer. Bu yöntem, bir dosyaya senkronize olarak okuma ve yazma yapmak için kullanılabilecek bir FileSystemSyncAccessHandle
objesi döndüren bir Promise döndürür. Bu yöntemin senkronize yapısı performans avantajları sağlar ancak bu nedenle, ana iş parçacığı engellenmemesi için yalnızca Kaynak Özel Dosya Sistemi'ndeki dosyalar için özel Web İşleyiciler içinde kullanılabilir.
Gerekli üstbilgileri ayarlama
İndirilen SQLite Wasm arşivi, diğer dosyaların yanı sıra sqlite3 WASM/JS derlemesini oluşturan sqlite3.js
ve sqlite3.wasm
dosyalarını da içerir. jswasm
dizini, temel sqlite3 teslimatlarını içerir. Üst düzey dizinde ise gösterim ve test uygulamaları bulunur. Tarayıcılar, file://
URL'lerinden Wasm dosyaları yayınlamaz. Bu nedenle, bu URL'leri kullanarak oluşturduğunuz uygulamalar için bir web sunucusu gerekir ve bu sunucu, dosyaları yayınlarken yanıtında aşağıdaki üstbilgileri içermelidir:
Cross-Origin-Opener-Policy
, tarama bağlamını yalnızca aynı kaynaktaki dokümanlarla izole edensame-origin
yönergesi olarak ayarlanır. Kaynaklar arası dokümanlar aynı tarama bağlamında yüklenmez.Cross-Origin-Embedder-Policy
,require-corp
yönergesi olarak ayarlanır. Böylece bir doküman yalnızca aynı kaynaktan veya başka bir kaynaktan yüklenebilir olarak açıkça işaretlenmiş kaynakları yükleyebilir.
Bu üstbilgilerin nedeni, SQLite Wasm'in SharedArrayBuffer
'e bağlı olması ve bu üstbilgilerin ayarlanmasının güvenlik şartlarından biri olmasıdır.
DevTools ile trafiği incelerseniz aşağıdaki bilgileri görürsünüz:
Hız testi
SQLite ekibi, desteği sonlandırılan Web SQL'e kıyasla WebAssembly uygulamalarında bazı karşılaştırmalar yaptı. Bu karşılaştırmalar, SQLite Wasm'in genellikle Web SQL kadar hızlı olduğunu gösteriyor. Bazen biraz daha yavaş, bazen biraz daha hızlı olur. Tüm ayrıntıları sonuçlar sayfasında bulabilirsiniz.
Başlangıç kodu örneği
Daha önce de belirtildiği gibi, Origin Private File System kalıcı arka ucuna sahip SQLite Wasm'in bir Worker bağlamında çalıştırılması gerekir. Ancak kitaplık tüm bunları sizin için otomatik olarak yapar ve doğrudan ana mesaj dizisinden kullanabilirsiniz.
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
Yukarıdaki kodun işleyiş şeklini demoda görebilirsiniz. Glitch'teki kaynak koda göz atın. Aşağıdaki yerleştirilmiş sürümün OPFS arka ucunu kullanmadığını ancak demoyu ayrı bir sekmede açtığınızda OPFS arka ucunun nasıl kullanıldığını unutmayın.
Kaynak Gizli Dosya Sistemindeki Hata Ayıklama
SQLite Wasm'in Origin Private File System çıkışında hata ayıklama yapmak için OPFS Explorer Chrome uzantısını kullanın.
Uzantıyı yükledikten sonra Chrome Geliştirici Araçları'nı açın ve OPFS Gezgin sekmesini seçin. SQLite Wasm'in kaynak Özel Dosya Sistemi'ne ne yazdığını incelemeye hazırsınız.
Geliştirici Araçları'ndaki OPFS Gezgini penceresindeki dosyalardan herhangi birini seçerseniz yerel diske kaydedebilirsiniz. Ardından, SQLite Wasm'in gerçekten de vaat edildiği gibi çalıştığından emin olmak için veritabanını incelemek üzere SQLite Viewer gibi bir uygulama kullanabilirsiniz.
Yardım alma ve geri bildirim gönderme
SQLite Wasm, SQLite topluluğu tarafından geliştirilip yönetilmektedir. Destek forumunda arama yaparak ve mesaj göndererek yardım alabilir ve geri bildirimde bulunabilirsiniz. Belgelerin tamamına SQLite sitesinden ulaşabilirsiniz.