[Web] 웹 콘텐츠 캐싱 (브라우저, 프록시-CDN, 서버) 비교

개요

웹 콘텐츠 캐싱은 이미지, 비디오, css, js 등과 같은 웹 콘텐츠를 사용자에게 더 빠르고 효율적으로 제공하기 위해 임시로 캐싱(저장)해두는 기술로 사용자의 원본 서버에 다시 접근하지 않고, 캐시에 저장된 데이터를 사용해 웹 페이지를 로드하는 방식

 

서버와 네트워크 부하를 줄여 응답 속도를 개선하고, 사용자 경험을 향상시킬 수 있는 장점이 있음

 

브라우저 캐시  vs 프록시 캐시 vs 서버 캐시

주요 내용은 다음과 같다.

	브라우저 캐시 (Client-Side)	프록시 캐시 (Proxy or CDN)	서버 캐시 (Server-side)
목적	동일 웹페이지 재방문시 빠른 로딩	빠른 콘텐츠 전송 및 지연 시간 감소	서버 부하 ↓ 응답 속도와 효율성 ↑
대상	정적 리소스 (CSS, JS, 이미지)	정적(이미지) 및 동적(비디오) 콘텐츠	쿼리 결과나 동적 계산 결과
저장 위치	사용자의 웹 브라우저	프록시 서버 / CDN  (Content Delivery Network)	서버 메모리 캐시 디스크 캐시
예시	ex) 특정 웹사이트의 고정 이미지	ex) 넷플릭스 전세계 송신 비디오 콘텐츠, 리사이징 이미지	ex) 쇼핑 웹사이트 주간 인기 품목
특징	유저 캐시 파일이 오래되면 변경 및 삭제 필요	변경되는 콘텐츠 들에 대해서 캐시 무효화(Invalidation) 처리 필요	메모리 캐시 (Redis, Memcached) 디스크 캐시 를 통해 동일한 요청 (복잡합 DB 쿼리 등) 에 대해 응답

 

HTTP 요청 - Cache-Control 헤더

HTTP 요청 간 Cache-Control 헤더를 통해, 웹 서버 -> 브라우저 에게 특정 리소스를 일정 시간동안 로컬에 캐시하도록 지시하는 것

ex) max-age 값: 캐시된 콘텐츠 유효 시간 지정 / no-cache: 캐시 콘텐츠 있어도 매번 유효성 검사하도록 / no-stroe : 캐싱 없이 항상 서버에서 가져오기

 

ETag 라는 서버가 특정 리소스의 버전을 식별하기 위해 서버가 설정한 고유한 문자열 헤더를 통해, 이 값을 기반으로 해당 리소스가 변경되었는지 여부를 확인 가능. 클라이언트가 리소스 요청시 ETag 값에 따라 최신인지를 판단하고 응답함

 

ex) Cache-Control: max-age=3600 : 클라이언트가 해당 리소스를 1시간 동안 캐시

 

HTTP 요청 - CDN 캐싱

CDN(Content Delivery Network)을 통해 전 세계에 분산된 클라이언트 - 서버간 중간 Proxy 서버 역할로서, 콘텐츠를 사용자에게 전달

 

Cache-Control 은 개별 클라이언트에 대상으로 캐싱을 한다면,

CDN은 전 세계에 분산된 서버 네트워크를 통해 성능을 향상 시키는 방법

 

이는 다양한 클라이언트에서 서버로 요청하는 트래픽에 도움을 주고, 서버 부하 감소에 효과적임