[CS] 캐시의 장단점과 활용도

 

캐시의 장단점과 어떤 부분에 활용하는지 

 

캐싱의 장점

1. 성능 향상: 캐싱은 서버에 대한 요청 수를 줄이고 대기 시간을 줄여 페이지 로드 시간을 단축하고 응용 프로그램 응답 속도를 높입니다.
2. 서버 부하 감소: 캐싱은 클라이언트 측에 데이터를 저장함으로써 서버의 부하를 줄여 더 많은 요청을 효율적으로 처리할 수 있도록 합니다.

캐싱의 단점

1. 오래된 데이터: 캐싱의 주요 문제 중 하나인 사용자가 최신 데이터를 받을 수 있도록 보장하는 것입니다. 데이터가 캐시되면 부실하거나 오래된 정보를 제공할 위험이 있어 사용자 경험이 부정확하거나 일관되지 않을 수 있습니다.
2. 스토리지 제한: 캐싱은 특히 스토리지 용량이 제한된 장치에서 로컬 스토리지 리소르를 소비할 수 있습니다. 이로 인해 다른 중요한 데이터가 제거되거나 장치 성능에 영향을 줄 수 있습니다.

캐싱을 사용할 부분

1. 정적 자산: 이미지, 스타일시트 및 JavaScript 파일과 같은 정적 리소스를 캐시하여 요청 수를 줄이고 페이지 로드 시간을 개선합니다.
2. API 응답: 요청을 최소화하고 대기 시간을 줄이기 위해 백엔드 서비스에서 가져온 API 응답 또는 데이터를 캐시합니다.

 

 

프론트엔드에서 캐시를 사용할 수 있는 2~3가지 영역을 제시해주세요.

 

 

1. 리소스 캐싱: 브라우저는 이미지, 스타일시트 및 JavaScript 파일과 같은 정적 자산을 캐싱하여 서버에 대한 요청 수를 줄이고 페이지 로드 시간을 단축할 수 있습니다. 캐시 제어 헤더를 구현하거나 서비스 작업자를 사용하여 이러한 리소스가 브라우저의 캐시에 저장되는 기간과 새로 고쳐야 하는 시기를 구성할 수 있습니다.
2. API 응답 캐싱: 많은 웹 애플리케이션에서 데이터는 API 또는 백엔드 서비스에서 가져옵니다. 요청 수를 최소화하고 대기 시간을 줄이기 위해 프런트엔드에서 API 응답을 캐시할 수 있습니다. 이는 메모이제이션, 브라우저 저장소(예: IndexedDB, LocalStorage)에 데이터 저장 또는 GraphQL용 Apollo 클라이언트와 같은 클라이언트 측 라이브러리를 사용하는 것과 같은 기술을 사용하여 달성할 수 있습니다.
3. UI 상태 캐싱: 사용자가 웹 애플리케이션과 상호 작용할 때 UI 상태가 자주 변경될 수 있습니다. 양식 데이터 또는 사용자 기본 설정과 같은 UI 상태의 일부를 캐싱하면 페이지 간을 탐색하거나 실수로 페이지를 새로 고칠 경우 데이터 손실을 최소화하여 사용자 환경을 개선할 수 있습니다. 이는 UI 상태를 효율적으로 저장하고 관리할 수 있는 Redux, MobX 또는 Vuex와 같은 상태 관리 라이브러리를 사용하여 달성할 수 있습니다.