2014년 2월 3일 월요일

[튜토리얼/한글화] 모바일 브라우저에서 할당량과 함께 작업하기 : 브라우저 스토리지에 관한 연구 보고서(Working with quota on mobile browsers: A research report on browser storage)

HTML5Rocks에 +Eiji Kitamura의 "모바일 브라우저에서 할당량과 함께 작업하기 : 브라우저 스토리지에 관한 연구 보고서(Working with quota on mobile browsers: A research report on browser storage)"가 업데이트되었습니다.

"HTML5이 도입되면서 서버에서 클라이언트로 이동한 것은 단지 로직만이 아닙니다. 데이터 저장소 역시 클라이언트로 범위를 확대하였습니다. 이러한 클라이언트 측의 데이터는 브라우저가 관리하는 공간 속에 저장됩니다. 또한 다양한 액세스 방법은 적합한 방식을 개발 중에 선택할 수 있도록 하였습니다. 그러나, 이러한 저장소는 웹 앱 입장에서 보면 브라우저에 의해 컨트롤되고 있으며 이에 의한 다양한 제한점이 존재하기 때문에 이에 대한 숙지가 필요합니다."


TL;DR;


HTML5 이전에 사용자의 데이터를 저장하기 위해 쿠키를 사용하는 것 이외에는 대안이 없었지만 HTML5의 가장 큰 혁신 중 하나는 브라우저 상의 영구적인 저장소를 제공한다는 것입니다.

HTML5의 시대가 오면서 웹 어플리케이션이 점점 더 풍부해짐에 따라 더 많은 개발자가 브라우저 측의 스토리지를 사용하고 있습니다. 그러나 다양한 한계를 비교하는 중요한 연구가 이루어지고 있지 않으므로  개발자가 이를 극복하기 위한 시간이 소요됩니다. 이 튜토리얼은 다양한 브라우저에 대한 스토리지 상의 제한점들과 이를 측정하는 방법에 대해 다루고 있습니다.

이 튜토리얼에서 다루는 대상 스토리지는 다음과 같습니다.

  • WebStorage
    • 키-값(Key-Value) 기반의 API를 제공하며 일반적으로 가장 많이 사용됩니다. (익히 아시다시피 WebStorage는 반영구적으로 저장 가능한 LocalStorage와 세션이 연결된 동안만 사용할 수 있는 SessionStorage로 나뉘어집니다.)
  • WebSQL Database
    • 브라우저를 위한 관계형 데이터베이스(RDB)를 제공합니다. 실제 WebSQL은 W3C에서 표준화 진행을 중단한 상태이지만 현재까지는 브라우저에서는 사용이 가능한 상태입니다.
  • Indexed Database
    • 자바스크립트 객체가 저장가능하고 이를 기반으로 한 인덱스 처리가 가능한 새로운 규격입니다. 점진적으로 이에 대한 지원 및 사용이 확장될 것입니다.
  • FileSystem API
    • 웹을 위한 파일 시스템입니다. 개발자는 샌드박스 형태로 사용자의 파일 시스템을 사용할 수 있으며 이를 URL 형태로 직접 참조할 수도 있습니다. 현재 크롬과 오페라만 이를 구현하고 있지만 표준화는 순조롭게 진행 중입니다.
  • Application Cache
    • 단일 페이지 어플리케이션을 위한 강략한 캐쉬 메커니즘을 제공합니다. 그러나 많은 제한점으로 인해 ServiceWorker로 불리는 표준 규격이 이를 대치할 예정입니다. 현재(2014, Jan.)까지 이를 제외하면 진정한 오프라인 웹앱 솔루션은 없다고 해도 과언이 아닙니다.


보다 자세한 내용은 튜토리얼을 참고하시기 바랍니다.



번역 링크