🎯 Achievement Goals

메모리 계층 구조에 대해 간단하게 이해한다.

캐시(Cache)가 무슨 뜻인지 이해한다.

캐시(Cache)의 일반적인 작동 원리에 대해 이해한다.

웹 캐시에 대해 이해한다.

웹 브라우저에서 웹 캐시를 어떻게 결정하는지 이해한다.

메모리 계층 구조

memory layer

오늘은 캐시에 대해서 집중적으로 블로깅을 할 예정이지만, 그 전에 캐시를 왜 알아야 하는지 알려면 메모리 계층 구조에 대해 간략하게 이해를 해야 한다. 그래서 정말 간단히 알아보려고 한다.

먼저 일반적으로 데이터를 저장하는 공간의 속도와 용량은 반비례 관계이다. 즉, 싼 메모리는 용량이 크지만 느리고, 비싼 메모리는 용량이 작지만 빠르다.

그래서 컴퓨터 메모리는 용량이 많고 느린 아래쪽에서, 용량이 작고 빠른 위쪽으로 올라가는 계층 구조를 지니고 있다. 이를 ‘메모리 계층 구조’라고 한다.

데이터 지역성의 원리

컴퓨터에서 자주 쓰이는 데이터는 시간적 혹은 공간적으로 한 곳에 몰려 있을 가능성이 높다고 한다. 이러한 판단은 지역성 원리를 따르며, 지역성 원리는 시간 지역성(Temporal locality)과 공간 지역성(saptial locality)으로 구분해서 볼 수 있다.

시간 지역성은 최근 접근한 데이터에 다시 접근하는 경향을 말한다. 예를 들어 for loop에서 인덱스 역할을 하는 변수 i는 짧은 시간안에 여러 번 접근이 이루어진다.

for (let i = 0; i < arr.length; i++) {
  arr[i] = i;
}

공간 지역성은 최근 접근한 데이터의 주변 공간에 다시 접근하는 경향을 말한다. 위 for loop의 경우 배열arr의 각 요소를 참조하면서 가까운 메모리 공간에 연속적으로 접근하고 있다. 배열의 요소들이 메모리 공간에 연속적으로 할당되기 때문이다.

컴퓨터가 발전함에 따라 CPU의 속도가 점점 빨라졌다. 하지만 메모리에는 여전히 한계가 있다. 이러한 한계 때문에 캐시가 등장하였고 캐시는 속도를 높이고 고속의 CPU와 동기화하기 위해 꼭 필요한 존재가 되었다. 메모리 계층 구조를 보면 캐시는 메인 메모리나 디스크보다는 비싸지만 CPU 레지스터보다는 훨씬 저렴하다는 것을 알 수 있다.

캐시(Cache)

캐시(Cache)란 컴퓨터 과학에서 데이터나 값을 미리 복사해 놓은 임시 저장소를 가리킨다. 캐시는 캐시의 접근 시간에 비해 원래 데이터를 접근 하는 시간이 오래 걸리는 경우나 값을 다시 계산하는 시간을 절약하고 싶은 경우에 사용한다.

캐시의 작동 원리

원본 데이터와는 별개로 자주 쓰이는 데이터들을 복사해 둘 캐시 공간을 마련한다. 캐시 공간은 상수 시간 등 낮은 시간 복잡도로 접근 가능한 곳을 주로 사용한다.
데이터를 달라는 요청이 들어오면 원본 데이터가 담긴 곳에 접근하기 전에 먼저 캐시 내부 부터 찾는다.
캐시에 원하는 데이터가 없거나 너무 오래되어 최신성을 잃었으면(Expiration) 그때서야 원본 데이터가 있는 곳에 접근하여 데이터를 가져온다. 이때 데이터를 가져오면서 캐시에도 해당 데이터를 복사하거나 혹은 갱신한다.
캐시에 원하는 데이터가 있으면 원본 데이터가 있는 공간에 접근하지 않고 캐시에서 바로 해당 데이터를 제공한다.
캐시 공간이 부족할 때는 안 쓰는 데이터부터 삭제하여 공간을 확보한다. (Eviction)

웹 캐시(Web Cache)

웹 캐시란, 사용자(client)가 웹 사이트에 접속할 때, 정적 컨텐츠(이미지, 비디오파일, HTML, JS, CSS 등)를 특정 위치(client, network 등)에 저장하여, 웹 사이트 서버에 해당 컨텐츠를 매번 요청하여 받는것이 아니라, 특정 위치에서 불러옴으로써 사이트 응답 시간을 줄이고, 서버 트래픽 감소 효과를 볼 수 있다.

웹 캐시의 종류

1.브라우저 캐시 (Browser Caches)

브라우저 또는 HTTP요청을 하는 Client Application에 의해 내부 디스크에 캐시
Cache된 리소스를 공유하지 않으면 개인에게 한정된 캐시
브라우저의 뒤로가기 버튼 또는 이미 방문한 페이지를 재 방문하는 경우 효과

2.프록시 캐시 (Proxy Caches)

브라우저 캐시와 동일한 원리로 동작하며 클라이언트나 서버가 아닌 네트워크 상에서 동작
큰 회사나 IPS의 방화벽에 설치되며 대기시간, 트래픽 감소, 접근 정책 등을 수행
한정된 수의 클라이언트를 위하여 무한대의 웹 서버의 컨텐츠를 캐시

3.게이트웨이 캐시 (Gateway Caches)

서버 앞 단에 설치되어 요청에 대한 캐시 및 효율적인 분배를 통해 가용성, 신뢰성, 성능등을 향상
무한대의 클라이언트들에게 한정된 수(또는 하나)의 웹 서버 컨텐츠를 제공

웹 캐시 컨트롤

webcache

웹 캐시는 브라우저 내의 어떠한 특정 공간에 정보를 저장해 놓고, 다시 같은 웹 페이지를 접속했을 때 더 빠르게 페이지를 접속할 수 있게 해주는 것이라고 설명했었다. 데이터를 주고 받아오는 부분에서 효율을 높이기 위해 이와 같이 작동하는 것을 ‘캐싱’이라고 표현한다. 그러면 이러한 것들은 어떻게 관리할까?

데이터를 받아올 때, HTTP 응답에 포함된 Cache-Control Header에 따라 받게 될 리소스를 결정한다. 그러면 어떻게 결정하는지 한 번 살펴보자.

캐시의 유효 기간: max-age

서버의 Cache-Control 헤더의 값으로 max-age={seconds}값을 지정하면, 이 리소스의 캐시가 유요한 시간은 seconds초이다.

한 번 받아온 리소스의 유효 기간이 끝나기 전까지 브라우저는 서버에 요청을 보내지 않고 디스크 또는 메모리에서만 캐시를 읽어와서 계속 사용한다.

headers

위의 사진은 실제로 내가 프로젝트하고 배포한 사이트에서 캡쳐해 온 것이다. 밑에 max-age=0이라고 써있는데, 이 뜻은 캐싱하지 않겠다는 뜻이다. 만약 0이 아니라 58421라고 써있으면 58421초 동안 캐시할 수 있다.

참고로 Cache-Control max-age 값 대신 Expires헤더로 캐시 만료 시간을 정확히 지정할 수도 있다.

캐시의 유효 기간이 지난 이후: 재검증(Revalidation)

캐시의 유효 기간이 지나면 브라우저는 서버에 조건부 요청(Conditional Request)을 통해 캐시가 유효한지 재검증(Revalidation)을 수행한다.

headers3

재검증 결과 브라우저가 가지고 있는 캐시가 유효하다면, 서버는 [304 Not Modified] 요청을 내려준다. [304 Not Modified] 응답은 HTTP 본문을 포함하지 않기 때문에 매우 빠르게 내려받을 수 있다.

대표적인 재검증 요청 헤더들로는 두 가지가 있다.

If-None-Match: 캐시된 리소스의 Etag값과 현재 서버 리소스의 Etag값이 같은지 확인
If-Modified-Since: 캐시된 리소스의 Last-Modified값 이후에 서버 리소스가 수정되었는지 확인

위의 Etag와 Last-Modified값은 기존에 받았던 리소스의 응답 헤더에 있는 값을 사용한다.

Etag란 데이터를 해시값으로 변환한 값을 말한다.

no-cache와 no-store

no-cache 값은 대부분의 브라우저에서 max-age=0과 동일한 뜻을 가진다. 즉, 캐시는 저장하지만 사용하려고 할 때마다 서버에 재검증 요청을 보내야 한다.

no-store값은 캐시를 절대로 해서는 안 되는 리소스일 때 사용한다. 캐시를 만들어서 저장조차 하지 말라는 가장 강력한 Cache-Control 값이다. no-store를 사용하면 브라우저는 어떤 경우에도 캐시 저장소에 해당 리소스를 저장하지 않는다.

참고 자료

서버와 클라이언트
웹 서비스 캐시 똑똑하게 다루기

← Previous Post Next Post →