스토리지 버킷을 사용한 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의 경우 버킷 이름 섹션에서 사용된 저장소 버킷을 확인할 수 있습니다.
아래 스크린샷에서 빨간색 상자로 강조표시되어 있습니다.
감사의 말씀
이 게시물은 님이 평가했습니다.
에반 스테이드 및
레이첼 앤드류.
달리 명시되지 않는 한 이 페이지의 콘텐츠에는 Creative Commons Attribution 4.0 라이선스에 따라 라이선스가 부여되며, 코드 샘플에는 Apache 2.0 라이선스에 따라 라이선스가 부여됩니다. 자세한 내용은 Google Developers 사이트 정책을 참조하세요. 자바는 Oracle 및/또는 Oracle 계열사의 등록 상표입니다.
최종 업데이트: 2024-06-13(UTC)
[{
"type": "thumb-down",
"id": "missingTheInformationINeed",
"label":"필요한 정보가 없음"
},{
"type": "thumb-down",
"id": "tooComplicatedTooManySteps",
"label":"너무 복잡함/단계 수가 너무 많음"
},{
"type": "thumb-down",
"id": "outOfDate",
"label":"오래됨"
},{
"type": "thumb-down",
"id": "translationIssue",
"label":"번역 문제"
},{
"type": "thumb-down",
"id": "samplesCodeIssue",
"label":"샘플/코드 문제"
},{
"type": "thumb-down",
"id": "otherDown",
"label":"기타"
}]
[{
"type": "thumb-up",
"id": "easyToUnderstand",
"label":"이해하기 쉬움"
},{
"type": "thumb-up",
"id": "solvedMyProblem",
"label":"문제가 해결됨"
},{
"type": "thumb-up",
"id": "otherUp",
"label":"기타"
}]
{"lastModified": "\ucd5c\uc885 \uc5c5\ub370\uc774\ud2b8: 2024-06-13(UTC)"}
[[["이해하기 쉬움","easyToUnderstand","thumb-up"],["문제가 해결됨","solvedMyProblem","thumb-up"],["기타","otherUp","thumb-up"]],[["필요한 정보가 없음","missingTheInformationINeed","thumb-down"],["너무 복잡함/단계 수가 너무 많음","tooComplicatedTooManySteps","thumb-down"],["오래됨","outOfDate","thumb-down"],["번역 문제","translationIssue","thumb-down"],["샘플/코드 문제","samplesCodeIssue","thumb-down"],["기타","otherDown","thumb-down"]],["최종 업데이트: 2024-06-13(UTC)"]]