소메뉴

메인메뉴

2017.12.15 Friday 옥창원은 살아있다

팁&테크


 - Local Storage

HTML5 storage(http://dev.w3.org/html5/webstorage/)는 컴퓨터에서 저장된 정보나 복구하여 웹사이트에사 사용하는
방법을 제공한다.
이 개념과 비슷한 원리는 cookies이지만 거대한 양의 정보를 저장하기 위해서 디자인되었다.
Cookies는 저장되는 사이즈가 저장되어 있고, 데이터를 전송할때마다 매시간 서버에 새로운 페이지를 요청한다.
(이것은 추가적인 시간이나 brandwidth를 소비한다.)
HTML5 storage는 서버에 요청하지 않게 하면서, 웹사이트는 페이지 로드 후에 자바스크립트등을 접근가능하게 해준다.

Local Storage와 관련되어 HTML5 스펙에 포함이 되어 있는지 그렇다면 왜 따로 분리하여 명세서가
존재하는지에 대해서
궁금할 것이다.
그것에 대한 답변은 물론 Local Storage는 주요한 HTML5 명세서에 포함되어 있지만, 분리되어 명세서가 존재하는
이유는 "HTML5의 대한 내용이 방대하기 때문이다"라고 HTML5 Working Group에서 몇몇은 설명하고 있다.

브라우져가 HTML5 storage를 지원한다면, 전역 window 객체인 localStorage 속성을 사용 할 수 있다.
HTML5 storage를 지원하지 않는다면, localStorage 속성은 정의되어 있지 않을 것이다.

function supports_local_storage() {
  return (typeof window.localStorage != 'undefined');
}

Modernizr(http://www.modernizr.com/)는 아직 지원하지 않고 있다. 필요하다면 함수를 따로 만들어야 한다.

그렇다면 또 궁금한 점이 생길것이다. HTML5 storage database의 보안은 어떤지?
누구나 볼 수 있는 것인지?

사용자의 HTML5 storage database는 사용자의 컴퓨터를 사용할 수 있는 사람이라면 누구든지 물리적으로 접속 가능하다.
사용자의 브라우져에서 웹사이트의 값을 읽고 수정할 수 있지만, 해당 사이트들은 다른 사이트에 의해서 저장되어진 값들을 확인할 수 없게 할 수 있다.
이러한 방법을 same-origin restriction
(http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#origin-0)이라고 부른다.

- Web Workers

Web Workers는 브라우져에서 Javascript를 실행할때 background에서 실행되는 것을 표준적인 방법으로 제공한다.
Web Workers를 더많이 혹은 적게 같은 시간에 모든것을 실행하는 방법인 multiple "threads"를 생성한다.
(예를들면, 같은 시간에 당신의 컴퓨터에서 다양한 application을 실행할 수 있다라는 것이다.)
이것은 "background threads"고 복잡한 수학적 계산을 가능하게 하면서, network requests를 만들고, local storage를 접속가능하게 주면서, 웹페이지의 scrolling, clicking, typing에 응답하게 해준다.

브라우져가 Web Worker API를 지원한다면 전역 window객체의 worker 속성을 사용할 수 있다. Web Worker API를 지원하지 않는다라면 worker속성 또한 정의되어 있지 않을 것이다.

function supports_web_workers() {
  return typeof window.Worker != 'undefined';
}

이 기능 또한 Modernizr에서 아직 지원하지 않고 있고, 필요하다면 함수를 따로 만들어야한다.

원서 : http://diveintohtml5.org/detect.html
List of Articles
번호 제목 글쓴이 날짜 조회 수
30 이클립스 PHP + SVN [1] [1622] Lepas 2012-02-22 170590
29 [HTML5] Server-Sent-Event(SSE) 사용하기 [1961] Lepas 2011-12-14 160410
28 스프링3 프레임워크 강좌 블로그 [3450] Lepas 2011-06-21 232333
27 자바 소켓 서버 base - example source [3407] Lepas 2010-12-30 298461
26 우분투에서 웹서버 환경 구축하기 (LAMP or APM) [1922] Lepas 2010-10-07 199683
25 유용한 css 선택자 [3141] Lepas 2010-09-08 270977
24 HTML5의 모든것 file [2269] Lepas 2010-09-03 170456
23 [모바일웹] 아이폰 사파리에서 화면회전시 폰트 확대 방지 image [2468] Lepas 2010-08-18 221880
22 float을 clear하는 4가지 방법. image [1776] Lepas 2010-08-13 166963
21 패킷 캡쳐 프로그램 Fiddler [2208] Lepas 2010-07-30 216545
20 소스 비교 분석 프로그램 WinMerge [1988] Lepas 2010-07-24 183852
19 UIWebView와 APP간의 통신(communication [2919] Lepas 2010-06-03 362061
» HTML5의 소개 및 지원되는 않는 브라우져에서의 사용법 (5 - Local Storage(like cookie), Web Worker(Thread)) [1922] Lepas 2010-06-02 173139
17 [HTML5] localStorage와 sessionStorage 그리고 클라이언트 DB [2439] Lepas 2010-06-02 203615
16 EditArea - Textarea 구문강조 [1965] Lepas 2010-03-12 179523
15 iPhone Web 제작용 iui [1953] Lepas 2010-02-11 188678
14 JQuery Library [2090] Lepas 2010-02-05 213009
13 jQuery 개발자를 위한 메모 - 레퍼런스 [3631] Lepas 2010-02-02 158731
12 jQuery 개발자를 위한 메모 - 기본·샘플 [1742] Lepas 2010-02-02 159170
11 The Objective-C Programming Language 한글 번역본 file [2974] Lepas 2010-01-24 206754