캐시 (cache)
캐시란 데이터에 빠르게 접근하기 위해 자주 사용되는 데이터나 값을 미리 복사해 놓는 임시 장소를 의미한다.
웹 브라우저에서 네트워크를 통해 서버에 데이터를 요청하게 되면, 해당 서버가 응답을 반환할 때까지 페이지가 로드되지 않는다.
페이지 로딩에 필요한 css, js, html, 이미지 등의 정적 리소스를 캐싱하여 사용하게 되면, 요청을 보내는 네트워크 요청 횟수를 줄일 수 있을 뿐만 아니라 서버 응답을 기다려야 할 필요가 없기 때문에 사용자에게 보다 빠르게 화면을 보여줄 수 있다.
이러한 개념을 웹 캐싱이라고 한다.
캐시의 종류
- 캐시는 클라이언트에 보관할 수도 있고, 클라이언트와 서버 사이에 존재하는 프록시 서버 등의 중개 서버에서 보관할 수도 있다.
1) 클라이언트 측이 보관하는 것이 개인 캐시 (사설 캐시, 브라우저 캐시, private cache, browser cache) 이다. (Chrome 기준 disk cache, memory cache)
2) 서버에서 보관하는 것이 공용 캐시 (공유 캐시, shared cache, public cache)이다. (대표적인 예시로는 CDN)
- HTTP 헤더를 통해 Private 캐시, Public 캐시 별 설정을주기를 의도적으로 가져갈 수 있다.
ex) 보안상 Public 캐시에 저장하지 않아야되는 케이스, 다르게 가져가는 케이스 등...
HTTP 캐시는 2가지 종류로 나뉘어진다.
- 메모리 캐시
- 디스크 캐시
디스크 캐시는 하드 디스크 드라이브(HDD)에 저장되는 데이터의 임시 복사본이다. 웹 브라우저는 사용자가 방문한 웹 페이지의 리소스(이미지, CSS 파일, JavaScript 파일 등)를 디스크 캐시에 저장하여 나중에 동일한 페이지에 다시 방문할 때 해당 리소스를 다시 다운로드할 필요 없이 빠르게 불러올 수 있다. 이는 페이지 로딩 시간을 줄이고 대역폭을 절약하는 데 도움이 된다. 디스크 캐시는 일반적으로 하드 디스크의 일부 공간을 할당받아 관리되며, 운영 체제 또는 브라우저 설정을 통해 크기를 조정할 수 있다.
메모리 캐시는 웹 브라우저가 사용자의 시스템 RAM (Random Access Memory)에 저장하는 데이터의 임시 복사본입니다. 메모리 캐시는 더 빠른 액세스 속도를 제공하기 때문에 디스크 캐시보다 성능이 우수합니다. 웹 브라우저는 주로 사용자가 방문한 웹 페이지의 리소스를 메모리 캐시에 저장하여 더 빠르게 로드할 수 있도록 합니다. 메모리 캐시의 크기는 사용자 시스템의 사용 가능한 RAM에 따라 달라지며, 일반적으로 브라우저가 관리합니다. 브라우저가 종료되면 메모리 캐시에 저장된 데이터는 사라지므로 다시 다운로드해야 합니다.
웹사이트에 처음 접속했을때의 네트워크 상태이다. 이후에는 css 파일들이 캐싱되는 것을 알 수 있다.
캐시 제어 헤더 종류
Cache-Control 헤더
- HTTP/1.1부터 명시적으로 캐시를 제어할 수 있는 헤더를 추가했는데 그것이 cache-control 헤더 이다.
- 캐시의 유효 시간(생명 주기)과 관련된 내용을 명시하는 헤더
no-cache
- request 헤더 : 캐싱된 응답을 받지 않고 이 요청을 원본 서버에 그대로 전달 해 원본 서버로부터 항상 최신의 응답을 받겠다.
- response 헤더 : 캐싱된 데이터를 항상 유효한지 확인하도록 강제하는 설정이다.
캐싱을 하긴 하지만 원본 서버에는 항상 갔다 오게된다. 캐싱을 안하는건 아니다. 실제로 아무 캐시도 저장하지 않도록 하기 위해서는 no-store로 설정해주어야 한다.
no-store
- request, response 모두 동일하게 캐시를 사용하지 않겠다 라는 의미로 사용한다.
- no-store는 로컬에 저장하는 것 자체를 금지한다.
- 데이터에 민감한 정보가 포함되어 있어 저장 불가 하도록 처리할때 사용한다.
max-age
- 캐시 유효 시간, 초 단위 설정
- 예를 들어 max-age=60 은 1분간 캐싱한다는 내용이다.
- 다만, max-age 60초가 지났다고 해서 해당 리소스에 대한 캐시를 완전 버리지 않는다.
서버에 한번 물어보고(조건부 요청), 리소스 변경이 없다면 해당 캐싱된 리소스를 그대로 사용한다. - 흔히, 캐싱되지 않아야 하는 민감한 리소스에 대해 응답헤더에 Cache-Control:max-age=0을 사용한다.
Age
- Origin Server 의 응답이 프록시 캐시 서버에 머문 시간, 초 단위(sec).
expire
- max-age는 유효기간을 초단위로 설정 하였지만 expire는 만료일자를 지정한다. 정확한 날짜를 지정하여야 한다.
- Cache-Control 헤더에도 max-age로 유효 시간을 명시하는 것이 더 추천되기 때문에, 현재는 사용이 권장 되지 않고 하위 호환을 위해 사용된다.
- 만일 max-age와 동시에 사용되면 Expires는 무시된다.
public
- 응답 헤더에 사용할 수 있다.
- 모든 캐시 서버에 캐시될 수 있고 사용자 제한 없이 모든 사용자에게 응답이 전달될 수 있다.
private
- public 캐시에 저장 불가
- 최종 사용자 개인의 브라우저 환경에서만 캐싱을 하고, 외부 캐시서버(CDN 등의 범용 캐시 서버)에서는 캐싱할 수 없다.
ex) 로그인을 해서 내 정보가 들어있는 페이지 접근시, 내 브라우저가 아닌 만약 다른 외부서버에까지 내 정보가 캐싱되는 경우를 방지해 준다. 응답 메시지를 어디에 캐시할 것인지 지정하기 위해 사용할 뿐, 그 자체로 개인정보를 보호하는 장치가 되지는 않는다.
s-maxage
- 공유 캐시에 해당하는 캐시에만 적용되는 수명이며, 개인 캐시에서는 무시.
- 헤더의 age 필드와 비교해서 캐시의 유효성을 판단한다.
must-revalidate, proxy-revalidate
- must-revalidate : 캐시 만료후 최초 조회시 Origin Server 에 검증
- proxy-revalidate : 위의 내용을 공유(public) 캐시에만 적용한다.
ETag
- HTTP 응답 헤더로 리소스의 특정 버전에 대한 식별자라고 하며, 원본 서버가 리소스를 식별하기 위해 부여하는 고유 번호 이다.
- ETag는 임의의 문자들이 따옴표 안에 포함되도록 하며, 이 값은 원본서버에서 결정한다.
Pragma
- HTTP/1.0 하위 호환을 위해 사용하는 캐시 제어 헤더 이다. - Cache-Control과 동일한 역할을 수행하지만 권장되지 않는다.
ETC
- 크롬 브라우저를 기준으로 웹 브라우저는 크게 2가지 방법으로 캐싱을 한다. (브라우저 자체 알고리즘에 따라 다르다.)
- 메모리캐시 : RAM에 데이터를 저장해놓는 방식
- 디스크 캐시 : 하드 디스크에 파일로 저장해놓고 파일을 읽어서 저장하는 방식
