Il team di Chrome ha apportato una serie di miglioramenti relativi alle prestazioni all'implementazione di IndexedDB (IDB). Uno di questi miglioramenti è stato lo spostamento dell'archivio di backup di ogni istanza in una sequenza separata (che puoi considerare approssimativamente come un thread separato). Ciò significa che l'utilizzo simultaneo di IDB è ora più veloce, dallo stesso sito o da più siti. Questo post fornisce tutti i dettagli e spiega cosa devi fare per sfruttare questo cambiamento, disponibile a partire da Chrome 126.
Cross-site
Se utilizzi IDB su più siti, non devi fare nulla. Una volta eseguito questo spostamento a livello di browser e spostato l'archivio di backup di ogni istanza IDB in una sequenza separata, il miglioramento delle prestazioni avviene senza che tu debba fare nulla.
Same-site
Per ottenere questo miglioramento delle prestazioni per l'utilizzo dello stesso sito, devi separare l'utilizzo di IDB in istanze diverse, ovvero bucket di archiviazione. Il seguente esempio di codice mostra come può funzionare:
const request = indexedDB.open('main', 1);
request.onsuccess = (event) => {
/* Do stuff with the main instance. */
};
// By default, just use the regular IDB instance.
let idb = indexedDB;
// Open a separate storage bucket if the API is supported.
if ('storageBuckets' in navigator) {
const bucket = await navigator.storageBuckets.open('logs-bucket');
// Get access to the storage bucket's IDB instance.
idb = bucket.indexedDB;
}
const bucketRequest = idb.open('logs', 1);
bucketRequest.onsuccess = (event) => {
/* Do stuff with the separate instance. */
};
Supporto browser
Il miglioramento delle prestazioni menzionato in questo post è un miglioramento progressivo che puoi utilizzare quando l'API Storage Buckets è supportata nel tuo browser (a partire da Chrome 122) e quando le istanze IDB sono suddivise in shard, a partire da Chrome 126.
DevTools
Se ispezioni le istanze IDB con Chrome DevTools, puoi vedere il bucket di archiviazione utilizzato nella sezione Nome bucket, evidenziata con un riquadro rosso nello screenshot seguente.
Link correlati
- Non tutto lo spazio di archiviazione è uguale: introduzione dei bucket di archiviazione
- Specifiche della bozza
- Explainer
Ringraziamenti
Questo post è stato esaminato da Evan Stade e Rachel Andrew.