모던 앱에서 로컬스토리지 사용하기 - 종합 가이드

https://rxdb.info/articles/localstorage.html (목차) - 로컬스토리지가 뭔가요? - 로컬스토리지의 한계 - 그래도 여전히 로컬스토리지를 사용하는 이유 - 로컬스토리지를 사용하면 안되는 경우 - 로컬스토리지 대신에 사용할 수 있는 것들 - 결론 (미리보기) 편리한 기능에도 불구하고 로컬스토리지에는 개발자가 알아야 할 몇 가지 제한 사항이 있습니다: - 비동기 차단 API: 한 가지 중요한 단점은 localStorage가 비동기 차단 API로 작동한다는 것입니다. 즉, localStorage에서 수행되는 모든 작업이 잠재적으로 메인 스레드를 차단하여 애플리케이션 성능이 느려지고 사용자 환경의 응답성이 떨어질 수 있습니다. - 제한된 데이터 구조: 고급 데이터베이스와 달리 localStorage는 단순한 키-값 저장소로 제한됩니다. 이러한 제한으로 인해 복잡한 데이터 구조를 저장하거나 데이터 요소 간의 관계를 관리하는 데 적합하지 않습니다. - 문자열화 오버헤드: localStorage에 JSON 데이터를 저장하려면 저장하기 전에 데이터를 문자열화하고 검색할 때 구문 분석해야 합니다. 이 과정에서 성능 오버헤드가 발생하여 작업 속도가 최대 10배까지 느려질 수 있습니다. - 인덱싱 기능 부족: localStorage에는 인덱싱 기능이 부족하여 효율적인 검색을 수행하거나 특정 기준에 따라 데이터를 반복 처리하기가 어렵습니다. 이러한 제한은 복잡한 데이터 검색에 의존하는 애플리케이션을 방해할 수 있습니다. - 탭 차단: 다중 탭 환경에서는 한 탭의 로컬 저장소 작업이 CPU 리소스를 독점하여 다른 탭의 성능에 영향을 줄 수 있습니다. 두 개의 브라우저 창에서 이 테스트 파일을 열고 그 중 하나에서 로컬 저장소 삽입을 트리거하여 이 동작을 재현할 수 있습니다. 두 창 모두에서 표시 스피너가 멈추는 것을 관찰할 수 있습니다. - 저장소 제한: 브라우저는 일반적으로 각 원본의 로컬 저장소에 대해 약 5MB의 저장소 제한을 부과합니다. 성능에 대한 우려와 달리, localStorage API는 다른 스토리지 솔루션과 비교했을 때 놀라울 정도로 빠릅니다. 작은 키-값 할당을 효율적으로 처리하는 데 탁월합니다. 단순하고 브라우저와 직접 통합되어 있기 때문에 localStorage 데이터에 액세스하고 수정하는 데 최소한의 오버헤드가 발생합니다. 빠르고 간단한 데이터 저장이 필요한 시나리오의 경우, 로컬 스토리지는 여전히 괜찮은 선택지입니다.