스토리지 버킷을 사용한 IndexedDB 최대 성능

Chrome 팀은 IndexedDB (IDB) 구현을 제공합니다. 이러한 개선 사항 중 하나는 별도의 시퀀스에 저장하는 데 사용됩니다 (이는 별도의 스레드라고 할 수 있습니다. 즉, IDB를 동시에 사용하는 것은 이제 같은 사이트에서든 크로스 사이트에서든 더 빠르게 작업할 수 있습니다. 이 게시물에서는 이 이동을 활용하기 위해 취해야 할 조치에 대해 설명합니다. Chrome 126부터 사용할 수 있습니다

교차 사이트

크로스 사이트에서 IDB를 사용하는 경우 별도의 조치를 취할 필요가 없습니다. 이 각 IDB 인스턴스의 백업 저장소는 별도의 시퀀스로 이동한다면 별도의 작업 없이도 실적을 얻을 수 있습니다. 무엇이든 가능합니다.

동일 사이트

동일 사이트 사용에 대해 이러한 성능 향상을 얻기 위해서는 다른 인스턴스로 IDB 사용량을 분산할 수 있습니다 스토리지 버킷을 확인하세요. 다음 코드 샘플 작동 방식을 보여줍니다.

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. */
};

브라우저 지원

이 게시물에서 언급하는 성능 향상은 브라우저에서 Storage Buckets API가 지원되는 경우 (Chrome 122부터) 및 IDB 인스턴스가 샤딩되는 시점(Chrome 126부터)입니다.

데모

이 기능의 데모는 다음 페이지에서 확인하세요. 글리치. 소스 코드는 코드 스니펫의 실제 사용 사례입니다. 다음 2단계 인증을 주의 깊게 데모의 안내를 따르세요 Chrome으로 IDB 인스턴스를 검사한다면 DevTools의 경우 버킷 이름 섹션에서 사용된 저장소 버킷을 확인할 수 있습니다. 아래 스크린샷에서 빨간색 상자로 강조표시되어 있습니다.

IndexedDB 섹션을 검사하는 Chrome DevTools 두 개의 로그 데이터베이스, 즉 스토리지 버킷 이름은

감사의 말씀

이 게시물은 님이 평가했습니다. 에반 스테이드레이첼 앤드류.