브라우저 저장소

 

브라우저 저장소란?

 

웹 브라우저에서 데이터를 저장하는 방법이다. localStorage, sessionStorage, IndexedDB가 있다.

JavaScript를 사용하여 쉽게 조작할 수 있고,  데이터는 key-value쌍으로 저장이 된다. 일반적으로 데이터는 문자열 형식으로 저장되지만, 필요에 따라 객체나 배열 형태로 저장할 수도 있다.

 

localStorage

 

localStorage는 브라우저에 데이터를 저장하기 위한 key-value형태의 저장소이다. 이 저장소는 브라우저의 세션이 종료되어도 데이터가 유지되어 사용자가 다시 웹사이트를 방문할 때에도 이전에 저장한 데이터를 볼 수 있게 해준다.

 

장점

• 데이터를 지속적으로 유지할 수 있다.
• 저장소 용량이 크고, 대부분의 브라우저에서 5MB이상의 데이터를 저장할 수 있다.
• 간단한 API를 제공하여 데이터를 쉽게 읽고 쓸 수 있다.

단점

• 저장된 데이터는 사용자의 브라우저에 저장되기 때문에, 보안상의 문제가 발생할 수 있다.
• 도메인간 요청 문제가 발생할 수 있다.
• 서버와 동기화할 수 없다.

sessionStorage

 

localStorage와 유사하지만, sessionStorage는 데이터가 브라우저 세션 동안에만 유지된다. 개인정보와 같은 중요한 데이터를 안전하게 저장할 수 있다.

 

장점

• 데이터가 브라우저 세션 동안 유지되기 때문에 보안상의 이점이 있다.
• 저장소 용량이 크며, 대부분의 브라우저에서 5MB 이상의 데이터를 저장할 수 있다.
• 간단한 API를 제공하여 데이터를 쉽게 읽고 쓸 수 있다.

단점

• 데이터가 브라우저 세션 동안만 유지되어, 사용자가 세션을 종료하면 데이터가 삭제된다.
• 서버와 동기화할 수 없다.

 IndexedDB

 

IndexedDB는 브라우저에 대규모 데이터를 저장하기 위한 비관계형 데이터베이스이다. 비동기 API를 사용하여 데이터를 읽고 쓸 수 있다.

 

장점

• 대규모 데이터를 저장할 수 있다.
• 관계형 데이터베이스와 유사한 기능을 제공한다.
• 복잡한 쿼리를 실행할 수 있다.
• 서버와 동기화할 수 있다.

단점

• API가 복잡하며, 사용하기가 어렵다.
• 저장소 용량이 작고, 대부분의 브라우저에서 50MB 이하의 데이터를 저장할 수 있다.
• 데이터를 읽고 쓰는 과정에서 성능 문제가 발생할 수 있다.

 

「localStorage는 데이터를 지속적으로 유지하고 싶을 때, sessionStorage는 보안 상의 이유로 데이터를 일시적으로 저장하고 싶을 때, IndexedDB는 대규모 데이터를 저장하고 관계형 데이터베이스와 유사한 기능을 사용하고 싶을 때 유용하다.」