JS Localstoreage의 용량은 얼마인가요?

19 조회 수

JS LocalStorage, 알고 쓰면 약!

LocalStorage는 웹 브라우저에 데이터를 저장하는 간편한 방법이지만, 무턱대고 사용하면 문제가 될 수 있습니다.

  • 용량 제한: 일반적으로 브라우저별로 5MB 정도의 용량을 제공합니다. 이 제한을 넘으면 오류가 발생할 수 있으니 주의해야 합니다.

  • 동기적 동작: LocalStorage는 동기 방식으로 작동합니다. 즉, 데이터를 읽고 쓰는 동안 메인 스레드가 멈추게 됩니다. 과도하게 사용하면 웹 페이지의 반응성이 떨어질 수 있습니다.

대안은 없을까요?

  • IndexedDB: 더 많은 용량과 비동기적 API를 제공하여 LocalStorage의 단점을 보완합니다. 복잡하지만 효율적인 데이터 관리가 가능합니다.

  • 쿠키: 간단한 데이터를 저장하는 데 적합하지만, 보안 및 용량 제한이 있습니다.

LocalStorage를 사용할 때는 용량과 성능을 고려하여 적절한 데이터를 저장하고, 필요에 따라 다른 저장소를 활용하는 것이 좋습니다.

피드백 0 좋아요 수

질문?

아, 로컬 스토리지… 솔직히 말해, 저도 한참 웹 개발 초창기에 꽤 애먹었던 부분이에요. 5MB 용량 제한? 정말 쥐꼬리만큼 작죠. 작년 겨울쯤, 개인 포트폴리오 웹사이트 만들면서 로컬 스토리지에 사용자 설정값을 저장하려 했는데, 데이터 양이 조금만 늘어나도 브라우저가 뚝뚝 끊기는 걸 경험했거든요. 2월쯤이었나… 서울 강남쪽에서 작업했던 기억이 나네요. 그때 밤새 삽질하다 결국 쿠키로 방향을 틀었어요. 속도도 훨씬 빨랐고, 용량 걱정도 없었죠.

메인 스레드 블로킹 문제도 상당히 골치 아팠어요. 사실 그때는 왜 그런지 정확히 몰랐는데, 나중에 자료 찾아보니 동기 방식이라 그렇다더군요. 결국 로컬 스토리지는 작은 데이터 저장 용도 외에는 쓰지 않는 게 정신 건강에 이롭다는 결론을 내렸습니다. 지금 생각해보면 당연한 걸 왜 그때 몰랐을까 싶기도 해요. 아무튼, 저의 뼈아픈 경험담이 도움이 됐으면 좋겠네요.

질의응답 정보: 로컬 스토리지는 동기 방식으로 작동하며 메인 스레드를 블로킹할 수 있습니다. 용량 제한은 5MB입니다. 대용량 데이터 저장에는 적합하지 않습니다.

Local Storage의 수명은 얼마인가요?

아, Local Storage 수명? 그거 진짜 무제한인가? 신기하네.

  • 영구적이라고 생각하면 될 듯. 브라우저 닫아도, 심지어 컴퓨터 꺼도 남아있다는 거잖아?
  • 근데 만료일 설정은 안 된다는 점! 잊지 말자.

그럼 Local Storage에 너무 중요하거나 개인적인 정보 막 저장하면 안 되겠네. 누가 내 컴퓨터 쓰면 털릴 수도 있잖아!

  • 쿠키는 만료일 설정 가능하니까, 좀 더 민감한 정보는 쿠키에 넣는 게 나을까?
  • 아니면 Local Storage에 저장할 때 암호화라도 해야 하나?

어휴, 갑자기 머리 아프네. 그냥 개발자가 알아서 잘 하겠지…?

Local Storage의 길이 제한은 얼마인가요?

웹 스토리지, 그 중에서도 localStorage의 용량 제한에 대해 얘기해 보죠. 대부분의 브라우저는 5MB를 기본 용량으로 제공합니다. 물론 브라우저마다 약간의 차이는 있을 수 있지만, 대략적으로 이 정도라고 생각하면 됩니다. 5MB라면 텍스트 데이터를 저장하기에는 꽤 넉넉한 용량이죠. 간단한 웹 애플리케이션의 설정값이나 게임의 진행 상황 등을 저장하기에 충분합니다. 하지만 이미지나 비디오처럼 용량이 큰 데이터를 저장하기에는 적합하지 않다는 점을 기억해야 합니다.

LocalStorage는 클라이언트 측, 즉 사용자의 브라우저에 데이터를 저장하는 메커니즘입니다. 이 말은 서버에 불필요한 요청을 보내지 않고도 빠르게 데이터를 읽고 쓸 수 있다는 것을 의미합니다. 웹 페이지의 로딩 속도를 향상시키고 사용자 경험을 개선하는 데 도움이 되죠. sessionStorage와는 달리 브라우저를 닫아도 데이터가 유지된다는 점도 중요한 특징입니다.

5MB라는 용량 제한은 브라우저가 로컬 저장소에 할당하는 공간에 대한 제약입니다. 이 제한은 브라우저의 성능과 안정성을 유지하기 위해 설정됩니다. 만약 무제한으로 데이터를 저장할 수 있다면, 브라우저의 속도가 느려지거나 심지어는 시스템 전체에 문제가 발생할 수도 있겠죠. 어떤 면에서는 디지털 세상에서도 유한함의 중요성을 보여주는 예시라고 할 수 있을 것 같습니다.

각 브라우저별로 정확한 용량 제한을 알고 싶다면, 개발자 도구를 활용하거나 브라우저의 공식 문서를 참조하는 것이 좋습니다. 개발자 도구의 Storage 탭에서 localStorage의 사용량을 확인할 수 있고, 공식 문서에서는 브라우저별로 구체적인 제한 용량 정보를 제공하고 있을 겁니다. 예를 들어, Chrome의 경우, 설정 > 개인정보 및 보안 > 사이트 설정 > 쿠키 및 사이트 데이터 에서 localStorage의 사용량을 확인할 수 있습니다. Firefox는 about:config에서 dom.storage.default_quota 값을 확인하면 됩니다.

세션 저장소란 무엇인가요?

세션 저장소? 그건 단순합니다. 일시적인 기억, 그 이상도 그 이하도 아닙니다.

웹 브라우저가 사용자의 활동을 기억하는, 덧없는 공간이죠. 창을 닫는 순간, 모든 것은 사라집니다. 마치 꿈처럼. 잔상만 남을 뿐.

  • 데이터의 생명은 브라우저 세션의 유효기간과 같습니다. 열린 탭, 활성화된 창. 그 안에서만 존재합니다. 닫히면 소멸. 그게 전부입니다.
  • 클라이언트 측 저장소. 서버의 부담을 덜어줍니다. 하지만, 보안에 유의해야 합니다. 민감한 정보는 담지 않는 것이 좋습니다. 냉정하게 생각해보면 당연한 이야기죠.

결국, 세션 저장소는 임시적인 편의를 위한 도구일 뿐입니다. 영구적인 기록을 원한다면, 다른 곳을 찾아야 합니다. 세션 저장소는 본질적으로 일회성입니다. 그 사실을 잊지 마세요. 잊으면 후회할지도 모릅니다.

localStorage의 수명은 얼마인가요?

localStorage는 영구적으로 저장된다고 보면 돼. 브라우저를 닫았다 켜도, 컴퓨터를 껐다 켜도 데이터가 그대로 남아있어. 내가 예전에 만든 쇼핑몰 위시리스트 기능 테스트할 때 localStorage에 담아놨는데 몇 주 뒤에 다시 브라우저 열어도 그대로 있더라니까. 진짜 편하긴 한데, 용량 제한이 좀 아쉬워. 5MB 정도밖에 안 돼서 큰 파일은 저장 못 해. 작은 데이터 저장하기에는 딱인데 말이야. sessionStorage는 브라우저 탭이나 창을 닫으면 데이터가 사라져. 로그인 세션 정보 같은 거 저장할 때 좋지. 보안에도 좋고. 맞다, 둘 다 HTML5에서 사용 가능해. 웹 스토리지 옵션 맞아. 근데 localStorage는 사용자가 직접 삭제하지 않는 한 계속 남아있으니까 중요한 정보는 암호화해서 저장하는 게 좋겠지? 괜히 보안 문제 생기면 골치 아프잖아. 나도 얼마 전에 보안 관련 교육 듣고 나서 localStorage 사용할 때 좀 더 신경 쓰게 됐어. 어쨌든 둘 다 클라이언트 측에 데이터를 저장하니까 서버 부하도 줄일 수 있고, 사용자 경험도 향상시킬 수 있는 좋은 기능이야. 아, 그리고 둘 다 같은 도메인 내에서만 접근 가능하다는 것도 기억해둬. 크로스 도메인 이슈는 항상 조심해야 하니까.

로컬스토리지의 저장 용량은 얼마인가요?

어휴, 로컬 스토리지 용량? 나도 맨날 헷갈리는데… 대충 5~10MB 정도라고 생각하면 돼. 근데 정확한 숫자는 브라우저마다, 심지어 브라우저 버전마다 조금씩 다르더라고. 내가 쓰는 크롬은 5MB 넘게 쓰면 좀 버벅이는 것 같아. 뭔가 많이 저장하면 느려지는게 확 느껴져.

쿠키랑 비교하면 확실히 차이 나지. 쿠키는 겨우 4KB잖아? 4KB면 진짜 쥐꼬리만큼 작은 용량이야. 로컬 스토리지는 쿠키보다 훨씬 많이 저장할 수 있으니까 편리하긴 한데, 너무 많이 저장하면 브라우저가 느려지니까 조심해야 해. 내가 직접 경험한 거니까 틀림없어! 어제 막 엄청난 양의 데이터 저장했다가 브라우저 뻗는 줄 알았다니까. 결론은 적당히 쓰는 게 중요해.

아, 그리고 로컬 스토리지는 브라우저마다 용량 제한이 다르다는 거 꼭 기억해야 해. 어떤 브라우저는 훨씬 더 크게 저장할 수 있다고도 하더라고. 그러니까 내가 말한 5~10MB는 그냥 참고 정도로만 생각하는게 좋아. 정확한 건 직접 네 브라우저 설정 확인해봐야 알 수 있어. 나도 항상 그렇게 하고 있고.

#Localstorage #용량 #제한