캐시(Cache) 톺아보기(1) - 캐시란?

date
Mar 17, 2024
slug
in-depth-cache
author
status
Public
tags
Network
summary
type
Post
thumbnail
PNG to WEBP conversion.webp
category
updatedAt
Apr 7, 2024 02:34 PM

프론트엔드 챕터에서 캐시에 대한 이해가 왜 필요할까요?

웹 서비스 성능과 연관되기 때문입니다. HTTP 캐시를 적극적으로 사용하면 웹 성능을 높일 수 있습니다. *캐시를 잘못 관리했을 때 원하는 시점에 캐시가 사라지지 않거나, 필요 이상으로 HTTP 요청이 발생하기도 한다는 점을 기억해주세요.
 
캐시가 웹 서비스 성능과 어떤 연관이 있나요? 캐시를 잘 활용하면 웹 페이지의 로드 시간을 단축하여 사용자 경험을 향상시키고, 서버의 부하를 줄여 성능을 향상시키며, 서버의 대역폭 사용량을 줄여 비용을 절감할 수 있습니다. 또한, 캐시를 통해 오프라인 접근성을 제공하거나 네트워크 문제 발생 시 이전에 로드한 리소스에 계속 접근할 수 있도록 하여 서비스에 대한 신뢰성과 가용성을 높일 수 있습니다.
더 살펴보기
1. 성능 향상 및 로드 시간 단축 → UX 향상
캐시된 리소스는 사용자 브라우저에 로컬(메모리 or 디스크)로 저장됩니다. 브라우저가 추가 네트워크 요청을 하는 대신 캐시에서 데이터를 검색할 수 있기 때문에(접근이 빠름) 해당 페이지 재진입시 더 빨리 로드되게 해줍니다.
효과적인 캐싱 사용은 리소스가 로드될 때까지 기다리는 시간을 줄여 사용자에게 빠르고 반응성이 뛰어난 웹 애플리케이션을 제공할 수 있게됩니다.
2. 서버 로드 및 대역폭 사용량 감소
사용자 브라우저에서 또는 CDN(콘텐츠 전송 네트워크)을 통해 정적 리소스(예: CSS 파일, JavaScript 파일, 이미지)의 캐시된 버전을 제공함으로써 서버에 대한 직접 요청 수가 감소합니다. 서버 부하가 감소하면 특히 트래픽이 많은 상황에서 서버 성능이 향상됩니다.
서버 부하가 낮아지면 대역폭 사용량도 낮아지고 결과적으로 호스팅 비용도 낮아집니다. 대규모 애플리케이션의 경우 비용 절감 효과가 클 수 있습니다.
3. 향상된 신뢰성 및 가용성
캐싱 메커니즘, 특히 서비스 워커는 사용자에게 특정 기능을 제공하거나 오프라인이거나 인터넷 연결이 불안정한 경우에도 콘텐츠에 접근할 수 있는 기능을 제공할 수 있습니다.
캐싱은 대체 메커니즘으로 작동하여 서버나 네트워크 문제가 발생하는 경우 사용자가 이전에 로드한 리소스에 계속 접근할 수 있도록 보장합니다.
웹 캐시가 자신의 저장소 내에 요청된 리소스를 가지고 있다면, 요청을 가로채 원래의 서버로부터 리소스를 다시 다운로드하는 대신 리소스의 복사본을 반환합니다. 모든 클라이언트를 서비스할 필요가 없어지므로 서버의 부하를 완화하고, (캐시가 원래 서버에 비해서) 클라이언트에 더 가까이에 있으므로 성능이 향상됩니다. 즉, 리소스를 회신하는데 더 적은 시간이 들게 됩니다.
 

캐싱이란?

어떤 데이터를 한 번 받아온 후에 그 데이터를 불러온 저장소보다 가까운 곳임시로 저장하여, 필요시 더 빠르게 불러와서 사용하는 프로세스를 의미합니다. 메모리 계층 구조에서 캐시는 디스크나 메인 메모리보다 더 빠르게 데이터를 불러와서 사용해야 할 때 쓰입니다. 이러한 장점이 있는 만큼 단위 메모리당 x비용이 비싼 편입니다.
notion image
notion image
notion image

캐시의 종류

1. 접근성을 기준으로 분류
priviate cache - 한 명의 사용자만 사용하는 캐시를 말합니다. (캐시가 저장된 IP에서만 사용) 목표는 동일한 리소스에 대한 중복 요청을 방지하여 로드 시간을 개선하고 개별 사용자의 네트워크 트래픽을 줄이는 것입니다. 브라우저 캐시가 해당됩니다. 여기에는 HTML 페이지, CSS 스타일시트, JavaScript 파일 및 이미지와 같은 리소스가 사용자 장치에 로컬로 저장되는 브라우저 캐시가 포함됩니다.
shared cache - 여러 사용자가 사용하는 캐시를 말합니다. 예로는 프록시 캐시와 역방향 프록시 캐시, CDN, 역방향 프록시 캐시가 있습니다. 이러한 캐시는 일반적으로 ISP(인터넷 서비스 공급자) 내부 또는 대규모 조직의 인프라 내부와 같이 여러 사용자에게 서비스를 제공하는 네트워크 노드에 위치합니다. 목표는 공통적으로 액세스하는 리소스를 캐싱하여 전체 네트워크 트래픽을 줄이고 여러 사용자의 응답 시간을 향상시키는 것입니다. 자주 요청되며 자주 변경되지 않습니다.
 
2. 네트워크 계층의 위치로 분류
*네트워크 토폴로지에서의 위치
종류
위치
설명
Browser Cache
브라우저
한 번 받아온 리소스들을 재사용하여 속도가 빨라진다.
Shared Proxy Cache
브라우저와 ISP
조직 내에서 접속하는 웹 사이트의 리소스들을 캐시하여 속도가 빨라지고 네트워크 사용량을 줄인다.
Transparent Cache
ISP
ISP는 이 캐시를 이용하여 ISP간 대역폭 낭비를 줄인다.
Reverse Proxy Cache
ISP와 웹 서버
원본 서버로의 트래픽을 줄이고, 사용자에게 빠른 응답을 준다.
브라우저 캐시 (HTTP Cache) 단일 사용자가 전용으로 사용합니다. 브라우저 캐시는 그 사용자에 의하여 HTTP를 통해 다운로드된 모든 문서들을 가지고 있습니다. 이 캐시는 서버에 대한 추가적인 요청 없이 뒤로 가기나 앞으로 가기, 저장, 소스로 보기 등을 위해 방문했던 문서들을 사용할 수 있도록 해 줍니다. 또한 유사한 방법으로 캐시된 컨텐츠의 오프라인 브라우징을 개선시킵니다.
Shared Proxy Cache
프록시 캐시는 여러 사용자가 공동으로 사용하는 캐시입니다. 주로 ISP(인터넷 서비스 제공업체)가 설치하여 여러 사용자가 자주 조회하는 웹 사이트의 리소스를 캐시합니다. 이렇게 되면 네트워크 트래픽과 대기 시간을 줄이고, 사용자의 응답 시간을 개선시키는 효과가 있습니다. 프록시 캐시는 'Cache-Control' 속성을 가지며, 캐시에 관한 설정을 지시합니다. 또한, 클라이언트가 캐시를 적용하지 않았는데, 웹 브라우저가 임의로 캐싱하면 업데이트가 되지 않아 문제가 발생할 수 있기 때문에 캐시 무효화가 필요합니다.
notion image
Transparent Cache
투명 캐시는 웹 콘텐츠를 자동으로 캐시하는 중개 시스템으로, 사용자나 콘텐츠 제공자의 구성이나 직접적인 상호작용 없이 요청과 응답을 가로채어 저장합니다. ISP 네트워크나 회사 네트워크 등 다양한 지점에서 발생할 수 있으며 일반적으로 사용자 요청을 캐시로 전달하는 네트워크 라우팅 프로토콜이나 구성을 통해 수행됩니다. 이는 네트워크에서 전략적으로 배치되어 원본 서버에서 콘텐츠를 검색하거나 저장하여 사용자에게 제공합니다. 투명 캐싱은 원본 서버의 트래픽을 오프로드하여 웹사이트와 웹 서비스의 확장성을 높이는 데 도움이 됩니다. 이를 통해 서버 부하를 줄이고 트래픽 급증을 효과적으로 관리할 수 있습니다.
 
Reverse Proxy Cache 역방향 프록시 캐시는 하나 이상의 웹 서버 앞에 위치하며 콘텐츠가 프록시를 통과할 때 콘텐츠를 캐시합니다. 이 설정은 일반적으로 웹 애플리케이션의 속도와 확장성을 높이는 데 사용됩니다. 동일한 웹 애플리케이션이나 사이트에 액세스하는 여러 사용자에게 캐시된 콘텐츠를 제공합니다.
캐시 종류 더 보기
  1. 게이트웨이 캐시: 게이트웨이 캐시는 인터넷 서비스 제공업체(ISP)의 경계나 대규모 기업 네트워크 내에 위치하는 경우가 많으며 여러 사용자에게 콘텐츠를 제공합니다. 이는 둘 이상의 클라이언트가 재사용할 수 있도록 응답을 저장합니다. 주요 역할은 캐시된 콘텐츠를 광범위한 사용자 기반에 제공하여 공유 리소스 역할을 함으로써 대기 시간과 네트워크 트래픽을 줄이는 것입니다.
  1. CDN(콘텐츠 전송 네트워크): CDN은 지리적 위치를 기반으로 사용자에게 웹 콘텐츠와 비디오를 제공하기 위해 지리적으로 전략적으로 분산된 서버 네트워크입니다. CDN은 최종 사용자와 가까운 정적 콘텐츠를 캐시하여 공유 캐시 형식으로 만듭니다. CDN의 공유 특성을 통해 동일한 콘텐츠를 여러 사용자에게 효율적으로 제공하여 속도를 향상시키고 원본 서버의 부하를 줄일 수 있습니다.
  1. 로드 밸런서: 로드 밸런서는 들어오는 네트워크 트래픽을 여러 서버에 분산시켜 단일 서버가 압도당하지 않도록 하여 안정성과 용량을 높입니다. 로드 밸런서 자체는 캐시가 아니지만 많은 최신 로드 밸런서에는 자주 액세스하는 리소스를 저장하는 통합 캐싱 기능이 있습니다. 로드 밸런서 내의 캐싱 기능은 일반적으로 공유 캐시로 간주됩니다. 이는 캐시된 콘텐츠를 여러 사용자에게 제공하여 로드 시간을 줄이고 서버 로드를 줄이는 것을 목표로 하기 때문입니다.