pulse.huny.dev

HunyDev
Ensuring Persistent Browser Storage for WASM Databases: A Complete Guide

Ensuring Persistent Browser Storage for WASM Databases: A Complete Guide

OPFS 보존률을 높이는 한 줄

Hun Jang
Hun Jang Dec 7, 2025

브라우저에서 WASM/내장 DB를 오래·안전하게 보관하려면, OPFS에 초기화한 뒤 한 번만 await navigator.storage.persist()를 호출해 “영구 저장(persistent)” 권한을 확보하면 됩니다. 이렇게 하면 저장 공간 압박 시 데이터가 지워질 가능성이 크게 줄어듭니다. (MDN Web Docs)

왜 OPFS+persist?

  • OPFS(Origin Private File System)는 출처(origin)별 비공개 파일시스템으로, 바이트 단위 접근·인플레이스 쓰기 등 고성능 파일 I/O를 제공합니다. WASM SQLite/PgLite 같은 임베디드 DB의 디스크 백엔드로 적합합니다. (MDN Web Docs)
  • *StorageManager.persist()**를 승인받으면 브라우저가 저장소 청소(eviction) 전에 비영구 버킷을 먼저 비웁니다. 즉, 동일 용량이라도 데이터 생존성이 높아집니다. 현재 지원도 넓습니다. (MDN Web Docs)

함께 쓰면 좋은 API

  • navigator.storage.persisted()로 현재 영구 상태 확인. (MDN Web Docs)
  • navigator.storage.estimate()로 사용량/할당량 확인(usage/quota). (MDN Web Docs)

OPFS vs IndexedDB, 언제 무엇을?

  • OPFS: 파일 기반 DB(WASM SQLite, wa-sqlite 등), 대용량 바이너리, 순차/랜덤 I/O 최적화. (Chrome for Developers)
  • IndexedDB: 키-값/문서 저장, 폭넓은 호환성·트랜잭션, 일부 WASM DB는 동시성 보조 용도로 병행 사용. (PGlite)

최소 체크리스트

  1. OPFS 루트 얻기 → DB 초기화
  1. 최초 실행 시 persist() 요청(UX상 사용자 액션 뒤 호출 권장)
  1. 주기적으로 estimate()로 용량 안내/정리 UI 제공
  1. 대용량 쓰기라면 워커에서 OPFS 동기 액세스 핸들 사용 검토(성능↑) (Chrome for Developers)
 

You might also like

BlogPro logo
Made with BlogPro