본문 바로가기
IT

[네트워크] 웹 브라우저의 캐시(Cache)

by 끊임없는정진 2022. 10. 22.

▶캐시란?

 캐시(Cache)는 컴퓨터 환경에서 무언가를(주로 데이터) 저장하는 하드웨어와 소프트웨어의 총칭이다.

 최신의 데이터나 자주 접근하는 데이터에 사용되어 성능을 높이는데 사용된다. 캐시된 데이터는 일시적으로 저장매체에 주된 저장공간과는 분리되어 저장된다. 캐시는 주로 CPU, 어플리케이션, 웹 브라우저나 운영체제에 다양하게 쓰인다. 

 수많은 정보나 클라이언트의 요청을 따라가기에 한계가 있기 때문에 캐시가 쓰인다. 거의 모든 어플리케이션의 작업은 입력과 출력에 의존하기 때문에, 이런 방식으로 캐시는 데이터 접근시간 감소, 지연시간 감소, 입력과 출력을 향상시킨다. 

 

▶웹 브라우저에서 캐시는 어떻게 작동하는가?

 캐시 클라이언트가 데이터에 접근할 때, 먼저 캐시를 확인한다. 데이터가 발견된다면 이를 캐시 적중이라고 한다. 

※ 데이터를 요청하여 캐시 메모리에 접근했을 때 캐시 메모리가 해당 데이터를 가지고 있다면 이를 '캐시 적중(cache hit)'이라고 부르고, 없다면 '캐시 부적중(cahche miss)'라고 부른다. 

 캐시에서 찾을 수 없는 데이터는 주 메모리에서 가져와 캐시에 복사된다. Safari, Firefox 및 Chrome과 같은 웹 브라우저는 브라우저 캐싱을 사용하여 자주 액세스하는 웹 페이지의 성능을 향상시킨다. 예를 들어, 클라이언트 측에서 요청하는 html, image, js, css등에 대해 첫 요청 시에 파일을 내려받아 특정 위치에 복사본을 저장하고, 이후 동일한 URL의 Resource 요청은 다시 내려 받지 않고 저장된 파일을 사용하여 더 효율적으로 서비스한다. 

 

▶ 웹에서의 캐시 종류

1. 브라우저 캐시

 일반적으로 세션 한 번(즉, 브라우저의 현재 호출)에서 최신 표현인지 확인한다. 우리가 방금 전에 보았던 페이지를 다시 보기위해 뒤로가기 버튼을 누를 때 유용하게 쓰인다. 또한, 똑같은 이미지를 사용할 때, 브라우저의 캐시에서 즉각적으로 불러올 수 있다. 

2. 프록시 캐시

 프록시는 수백 수천 명의 사용자에게 서비스를 동일한 방식으로 제공한다. 프록시는 클라이언트나 서버가 아닌 네트워크 외부에 있기 때문에 어떻게든 요청을 라우팅해야하는데, 그 방법 중 한가지 방법은 브라우저의 프록시 세팅에서 수동으로 설정하는 방법이고 하나는 가로채는 방식(interception)으로 이루어진다. 가로채는 방식을 쓰는 프록시(Interception proxies)는 네트워크 그자체에 자신에게 리다이렉션 하게 하기 때문에, 클라이언트 측에서는 따로 설정필요도 없고 존재 자체를 몰라도 된다. 프록시 캐시는 공유되는 캐시라서(많은 사람들이 공유해서) 지연속도와 네트워크 트래픽을 개선하는데 아주 좋은 효과를 보인다. 

 프록시 캐시는 대기업과 ISP의 방화벽에 설치된다. 

3. 게이트웨이 캐시

 리버스프록시 캐시라고도 한다. 리버스프록시는 서버 앞에 리버스 프록시를 설치하여 대량의 트래픽을 여러개의 서버로 로드밸런싱을 가능하게 하는 방법이다. 이 리버스프록시 서버에 캐시 데이터를 저장할 수 있으면, 가용성, 신뢰성, 성능 등의 개선에 유용하다. 

 

▶ 캐시의 제어

1. HTML Meta Tags

 HTML에서 문서의 속성을 설명하는 태그를 문서의 <HEAD>에 넣을 수 있는데, 이러한 Meta tag는 사용하기는 쉽지만 효과적이지 않다. 이는 프록시 캐시가 아니라 몇몇의 브라우저 캐시에서만 적용되기 때문이다. 

2. HTTP 헤더

 HTTP헤더는 브라우저 캐시와 프록시가 캐시를 처리하는 방법에 있어 많은 제어를 제공한다. HTML에서는 볼 수 없으며 일반적으로 웹 서버에서 자동으로 생성된다. 서버에 따라 어느 정도 제어할 수 있다.

 

 

출처 : https://cyberx.tistory.com/9

https://www.mnot.net/cache_docs/#IMP-SERVER

https://www.techtarget.com/searchstorage/definition/cache

https://losskatsu.github.io/it-infra/reverse-proxy/#2-%ED%8F%AC%EC%9B%8C%EB%93%9C-%ED%94%84%EB%A1%9D%EC%8B%9Cforward-%EC%84%9C%EB%B2%84%EB%9E%80

댓글