웹 브라우저 성능 개선 및 웹 서버 부하 완화(3) - HTTP Cache 동작(Cache-control 헤더) + 캐시 이점

캐시할 데이터는 웹 서버가 반환하는 값

-> 반환값에 대한 소유주: 웹 서버

-> 웹 서버가 캐시를 모두 제어

 

Cache-control 헤더를 통한 세부 설정

캐시 입장에서 누가 갑이고 누가 을인가?

• 갑: 웹 서버: 웹 서버가 캐시를 하냐마냐 등을 모두 제어 -> Cache-control 헤더
• 을: 웹 브라우저나 프록시: 웹 서버가 보내는 Cache-control헤더를 보고 하라는 대로 순종

캐시 저장 여부: 캐시해? 말아?

• `no-store`: 캐시 안함
• `no-cache`: 캐시 함. 단, 매번 재검증 후 사용(패킷 경량화) -> 이름만 보고 캐시 안하는거아니야? 라고 헷갈리지 말기

 

캐시 저장 장소: 어디에 저장해?

• `public`: Private(웹 브라우저) + Shared(프록시) 모두에 저장 -> 브라우저에도 저장!!
• `private`: Private(웹 브라우저)에만 저장

 

캐시 재검증 주기: 얼마가 지나면 재검증해?

• `max-age`: Expires(유효시간)으로 변환(기존 Expires가 있다면 덮어쓴다)
  • `max-age=0`= `no-cache` = 매번 재검증
• `s-maxage`: 프록시 캐시에만 적용되는 유효기간
  • `s-maxage=31536000(1년)`, `max-age=0`란?
    • 웹 브라우저는 계속 CDN에게 재검증을 수행, CDN은 1년을 주기로 본 웹 서버에게 재검증
    • 웹 브라우저는 CDN 이 자체적으로 Invalidation(무효화)하지 않는한 1년 동안 같은 데이터만 가져온다
      • 그래서 서버에 새버전이 배포되고 난 후에 s-maxage가 지나지 않으면 프록시에 적용이 안되고, 웹 브라우저도 적용이 안된다.
      • 프록시를 invalidation을 해줘서 프록시를 비워준 후, 요청을 하면 프록시에 데이터가 없으니가 서버에서 새 버전을 가져오도록 한다.

 

재검증 필수: 재검증이 이뤄진 데이터만 보겠다.

• `must-revalidate`: 재검증 시 무조건 서버를 통해 재검증 된 값만 보겠다는 뜻
  • 서버와의 접속 문제로 재검증이 실패한 경우
    -> `max-age` 경우 기본 행동은 그냥 기존 캐시되어있는 데이터를 반환
    -> `must-revalidate` 가 활성화되어 있다면? 504 에러 = 웹 서버가 재검증 해줘야되는데 서버와 연락이 안된다
• `proxy-revalidate`: 프록시 캐시에 적용되는 `must-revalidate`옵션

 

SWR(stale-while-revalidate): 캐시의 즉시성과 최신성을 한번에

HTTP Cache 제어 중 SWR(stale-while-revalidate) 확장 디렉티브 전략

• 현재에(당장에) 캐싱된 컨텐츠를 즉시 로드하는 즉시성(stale 이더라도)
• 미래에 업데이트된 캐싱 컨텐츠가 사용될 수 있도록 보장하는 최신성
• 60초 이내에 요청이 오는 경우 (stale-while-revalidate=60)
  • 재검증 요청을 동시에 하면서 오래된 캐시(Stale)를 반환한다.

Cache-Control: max-age=1, stale-while-revalidate=60

• 0~1초(신선=즉시성) : 캐싱된 응답을 "재검증" 없이 바로 반환
• 1~60초(오래되었지만 반환과 동시에 재검증): 캐싱된 응답을 바로 반환 + "재검증" 요청(백그라운드) -> 재검증으로 인한 지연시간 패널티가 클라이언트에게 감춰진다.
• 60 + 초(재검증 = 최신성): 캐싱된 응답을 재사용하지 않음 + 서버에 요청 보내어 응답 캐싱 및 반환

---

HTTP Cache 이점

[웹 서버 입장]

웹 서버 부하 완화

• 반복 연산 감소: 웹 서버가 동적 웹 페이지를 생성하는 연산을 하지 않아도 된다. (저장된 캐시 반환하면 되니까)
• 트래픽 분산: 웹 서버가 모든 요청 트래픽을 받아내지 않아도 된다. (캐시가 일부 트래픽 분담)
  • x-maxage=1년이면 1년 동안 서버는 놀고 있어도 된다.
  • 부분 DDoS방어

•  

[웹 브라우저 입장]

1. 네트워크 트래픽 감소(레이터시 및 네트워크 대역폭 사용 감소
2. 유저 경험 증진

 

---

ref

• https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control