Web Storage API



[localStorage](https://texonom.com/localstorage-28eac128c31a413fafff46b74ad27be8)


[sessionStorage](https://texonom.com/sessionstorage-1a58856893f84bb69a7226a750b457ff)

**WebStorage역시 그냥 자바스크립트 객체이다.**
그래서 **자바스크립트 객체를 넣는것 역시 가능하며 문자열에 크기제한이 있는 cookie에 비해서 비교우위를 가진다.**
그리고 requst와 response시에 **모든 쿠키를 다 넘겨야 했는데 원래 비용이 큰 http통신에 더 큰 부하를 준다.**
그러나** WebStorage는 그냥 개발자가 선별해서 넘기면 되므로 http통신에도 부하를 줄일 수 있다.**

쿠키는 자신의 변화를 감지할 방법이 없다. web storage는 자신의 변화를 이벤트로 감지할 수 있다.

**5.세션의 정의**
cookie - 같은 브라우저면 다른 탭이나 다른 창(프로세스)일지라도 같은 세션이라고 정의
webstorage - 같은 브라우저일지라도 sessionStorage의 경우 다른 탭이면 다른 세션이라고 정의

### 3개 겹치지만 각자의 영역이 있다
webstorage는 원리는 cookie같지만 사용하는 느낌은 session에 더 가깝다.
사용해보면 은근히 session과 비슷한 점이 많다.
client단에서 사용하는 session느낌이다.
session은 정말 훌륭한 방법이지만 계속 cookie나 ywebstorage로 눈을 돌리는 이유는 간단하다.
서버에 부하가 너무 많이 걸리기 때문이다.
cookie나 webstorage에 고통을 분담해버리는게 좋을 것이다.
그러나 실상은 좀 그렇지는 않은편이다.
세션은 세션만의 영역이 확고하게 존재한다.
webstorage가 cookie의 많은 점을 보완한건 맞지만 브라우저별로 데이터를 나눈다는 점은 여전하다.
그리고 cookie가 떠앉는 보안 문제는 webstorage역시 같이 가지는 경우가 많다.


> [SQLite Wasm in the browser backed by the Origin Private File System - Chrome Developers](https://developer.chrome.com/blog/sqlite-wasm-in-the-browser-backed-by-the-origin-private-file-system)





