dev

stale-while-revalidate (SWR)

stale-while-revalidate 해당 아티클을 번역, 요약하여 쓴 글입니다.

What shipped?

  • stale-while-revalidate는 캐시 된 콘텐츠를 빠르게 로드하는 것과, 업데이트가 된 최신 콘텐츠를 로드하는 것 사이에서 균형을 이루도록 도와준다.

  • 응답 헤더의 Cache-Control 설정에서 max-age와 함께 사용한다.

  • Chorme75, Firefox68에서 지원하고 있고 지원하지 않는 브라우저에서는 stale-while-revalidate 설정은 무시된다.

What’s it mean?

  1. 브라우저는 캐시된 응답이 오래된 것(stale)인지 여부를 어떻게 알 수 있을까?
  • stale-while-revalidate를 포함하는 Cache-Control 응답 헤더에는 max-age도 포함되어야한다.

  • max-age 보다 작은 캐시 응답은 최신(fresh)이고, max-age 보다 큰 캐시 응답은 오래된 것(stale)으로 간주한다.

  1. revalidation process
  • 캐시된 응답이 오래되었지만, stale-while-revalidate 설정에 의해 제공되는 추가 시간 내에 있다면 revalidation 요청이 이루어진다.

age > max-age, age <= stale-while-revalidate인 경우

  • 캐시된 응답이 오래되었다면, 우선은 브라우저의 요청을 수행하는데 사용한다. 동시에 revalidation 요청을 보낸다.

  • revalidation 네트워크 응답은 로컬에 저장되며, 이전에 캐시였던 것을 대체하고, age를 재설정한다.

age > max-age, age > stale-while-revalidate인 경우

  • 오래된 캐시 응답이 stale-while-revalidate 설정에 의해 제공되는 추가 시간 범위를 벗어나면 캐시 응답을 브라우저의 요청을 수행하는데 사용하지 않는다. 대신 네트워크 기다린 후 새로운 응답으로 브라우저 요청을 수행하고 로컬 캐시를 새로운 응답으로 채우는 동작을 수행한다. (초기 요청 이행)

Example

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

0-1 second: 캐시된 응답을 사용한다. (No revalidation)

1-60 second: 캐시된 응답을 사용한다. (revalidate in the background)

60+ second: 네트워크 요청을 새로 보내고 기다린다.

What are the common use cases?

  • 현재 날씨 상태에 대한 API

  • 지난 한 시간 동안 작성된 주요 뉴스 헤드라인

  • 일반적으로 알려진 간격으로 업데이트되고, 여러 번 요청될 가능성이 높으며, 해당 간격 내에는 변화가 없는 응답의 경우 max-age를 통한 short-term caching에 적합하다.

  • stale-while-revalidate를 추가적으로 사용하면 네크워크 응답을 기다리지 않고 새로운 캐시 데이터를 사용할 수 있다.


Reference