본문 바로가기
CS/Web

[Web] 캐시의 종류 및 동작 순

by 위그든씨 2023. 1. 4.

꼭 볼것 : https://toss.tech/article/smart-web-service-cache

 

웹 서비스 캐시 똑똑하게 다루기

웹 성능을 위해 꼭 필요한 캐시, 제대로 설정하기 쉽지 않습니다. 토스 프론트엔드 챕터에서 올바르게 캐시를 설정하기 위한 노하우를 공유합니다.

toss.tech

참고: https://guiyomi.tistory.com/130?category=993662 

 

웹 캐시(web cache) 종류 및 동작 순서

캐시란 데이터에 빠르게 접근하기 위해 자주 사용되는 데이터나 값을 미리 복사해 놓는 임시 장소를 의미한다. 캐시를 적용하기 좋은 데이터는 다음과 같다. - 자주 참조되는 데이터 - 자주 변경

guiyomi.tistory.com

캐시의 정의 및 종류

  • Cache란 데이터에 자주 사용되는 data, 값미리 복사해 놓는 임시 장소로 data에 대한 접근을 빠르게 함.
  • 캐시에 적용하기 좋은 데이터
    • 자주 참조되는 데이터
    • 자주 변경되지 않는 데이터
    • 동일 입력에 대해 동일 출력을 보장하는 데이터
    • 페이지 로딩에 필요한 정적 리소스 등등 
  • 캐시 종류 
    • 서비스 워커 캐시
    • 브라우저 캐시
    • CDN (or 프록시 서버 캐시 ) - Content Distribution Network 

캐시 동작 순서

캐시는 서비스 워커 캐시 -> 브라우저 캐시 -> CDN 순으로 참조되며, 

모든 캐시에 유효한 응답(데이터)이 없을 경우에 (Origin Server) 서버에 요청을 보내서 응답을 받게 된다.

서비스 워커 캐시

  • 웹 워커의 일종으로 , 백그라운드에서 비동기적으로 실행되는 JS
  • 보안상의 이유로 https 에서만 사용 가능 

브라우저 캐시

  • HTTP캐시라고 부르며, 브라우저 or HTTP 요청을 보내는 Client 내부 디스크||메모리에 저장되는 캐시
  • 개인화 된 캐시이므로 client간 공유 불가능
  • HTTP 요청은 서버로 직접 요청을 보내지 않고, 브라우저 캐시로 라우팅 됨. (존재 시 데이터 반환)

CDN ( 프록시 캐시 )

  • client와 server 사이에 위치한 네트워크상에서 동작하는 캐시 ( eg. 회사 or IPS의 방화벽에 설치됨)
  • 다수의 웹 서버에서 공유하여 사용 가능
  •