웹 스토리지 개요

로컬 기기 저장소와 클라우드 기반 서버 저장소 모두에 적합한 저장소 메커니즘을 선택하는 것이 중요합니다. 우수한 스토리지 엔진을 사용하면 정보를 안정적으로 저장하고 대역폭을 줄이며 응답성을 개선할 수 있습니다. 올바른 스토리지 캐싱 전략은 오프라인 모바일 웹 환경을 사용하기 위한 핵심 구성 요소입니다.

이 문서에서는 스토리지 API 및 서비스를 평가하기 위한 간략한 기본 사항을 설명한 후 비교 표와 몇 가지 일반적인 안내를 제공합니다. 선택한 스토리지 주제를 자세히 이해하기 위한 리소스를 조만간 추가할 계획입니다.

스토리지 분류

먼저 웹 앱의 데이터 스토리지를 분석하는 데 사용할 수 있는 몇 가지 측정기준을 살펴보겠습니다. 나중에 이 프레임워크를 사용하여 웹 개발자가 사용할 수 있는 다양한 저장소 옵션을 열거하고 평가합니다.

데이터 모델

데이터 단위 저장 모델은 저장 및 검색 요청의 사용 용이성, 비용, 성능에 영향을 미치는 데이터 내부 구성 방식을 결정합니다.

  • 구조화된: SQL 기반 데이터베이스 관리 시스템의 일반적인 경우처럼 사전 정의된 필드가 있는 테이블에 저장된 데이터는 전체 쿼리 유형이 우선으로 알려져 있지 않은 유연한 동적 쿼리에 적합합니다. 브라우저에 있는 구조화된 데이터 스토어의 대표적인 예는 IndexedDB입니다.

  • 키-값: 키-값 데이터 스토어 및 관련 NoSQL 데이터베이스는 고유 키로 색인이 생성된 구조화되지 않은 데이터를 저장하고 검색하는 기능을 제공합니다. 키-값 데이터 스토어는 색인이 생성된 불투명 데이터에 지속적으로 액세스할 수 있다는 점에서 해시 테이블과 비슷합니다. 키-값 데이터 스토어의 주요 예로는 브라우저의 Cache API와 서버의 Apache Cassandra가 있습니다.

  • 바이트 스트림: 이 간단한 모델은 데이터를 가변 길이의 불투명한 바이트 문자열로 저장하여 애플리케이션 레이어에 모든 형태의 내부 구성을 남깁니다. 이 모델은 특히 파일 시스템 및 기타 계층적으로 구성된 데이터 blob에 적합합니다. 바이트 스트림 데이터 스토어의 주요 예로는 파일 시스템 및 클라우드 스토리지 서비스가 있습니다.

지속성

웹 앱의 저장소 메서드는 데이터가 영구화되는 범위에 따라 분석할 수 있습니다.

  • 세션 지속성: 이 카테고리의 데이터는 단일 웹 세션 또는 브라우저 탭이 활성 상태로 유지되는 동안만 유지됩니다. 세션 지속성이 있는 저장소 메커니즘의 예로는 Session Storage API가 있습니다.

  • Device Persistence: 이 카테고리의 데이터는 특정 기기 내의 세션 및 브라우저 탭/창에 걸쳐 유지됩니다. 기기 지속성이 있는 저장소 메커니즘의 예로는 Cache API가 있습니다.

  • 전역 지속성: 이 카테고리의 데이터는 세션 및 기기 간에 유지됩니다. 따라서 데이터 지속성의 가장 강력한 형태입니다. 전역 지속성이 있는 스토리지 메커니즘의 예로는 Google Cloud Storage가 있습니다.

브라우저 지원

개발자는 문제 영역에 가장 적합한 API를 선택해야 합니다. 하지만 표준화되고 잘 확립된 API가 맞춤 또는 독점 인터페이스보다 수명이 더 길고 더 광범위하게 지원되는 경향이 있다는 사실을 고려해야 합니다. 또한 더 광범위한 기술 자료와 풍부한 개발자 생태계를 활용할 수도 있습니다.

거래

종종 관련 스토리지 작업 모음이 원자적으로 성공 또는 실패하는 것이 중요합니다. 데이터베이스 관리 시스템은 전통적으로 관련 업데이트를 임의의 단위로 그룹화할 수 있는 트랜잭션 모델을 사용하여 이 기능을 지원했습니다. 이 기능은 항상 필요한 것은 아니지만 일부 문제 도메인에서 편리하고 때로는 필수적입니다.

동기/비동기

일부 저장소 API는 저장 또는 검색 요청이 요청이 완료될 때까지 현재 활성 스레드를 차단한다는 점에서 동기식입니다. 이는 저장 요청이 기본 스레드를 UI와 공유하는 웹브라우저에서 특히 부담스럽습니다. 효율성 및 성능을 위해 비동기 저장소 API가 선호됩니다.

Chrome DevTools에서 저장소 디버깅

Chrome DevTools를 사용하여 웹 저장소 API를 검사하고 디버그하는 방법에 대한 자세한 내용은 다음 문서를 확인하세요. 여기에 언급되지 않은 API는 DevTools에서 지원되지 않거나 적용할 수 없습니다.

여러 스토리지 API를 사용하는 경우 DevTools의 스토리지 지우기 기능을 확인하세요. 이 기능을 사용하면 버튼 클릭 한 번으로 여러 스토어를 삭제할 수 있습니다. 자세한 내용은 서비스 워커, 스토리지, 데이터베이스, 캐시 지우기를 참조하세요.

다음 단계...

지금까지 스토리지 메커니즘에 대해 고려해야 할 몇 가지 관련 방법을 살펴보고 현재 사용 가능한 가장 인기 있는 API와 서비스를 비교했습니다. 이제 관심 있는 주제 하나 이상을 자세히 살펴볼 수 있도록 곧 더 많은 콘텐츠를 추가할 예정입니다.