프론트 엔드 개발 성능 최적화 개념 공부

캐싱 기법에는 여러 가지가 있으며, 각각의 기법은 웹 페이지의 로딩 속도를 개선하고 서버 부하를 줄이는 데 도움을 준다. 

1. 브라우저 캐싱 (Browser Caching)

브라우저 캐싱은 클라이언트 측에서 웹 자원을 저장하여 사용자가 웹 페이지를 다시 방문할 때 로딩 시간을 단축시키는 방법이다. 브라우저 캐싱을 통해 자원 (이미지, 스타일시트, 스크립트 등)을 일정 기간 동안 로컬 저장소에 저장할 수 있다.

• Cache-Control 헤더: HTTP 응답 헤더에 Cache-Control을 설정하여 자원의 캐싱 정책을 정의한다
  • Ex) Cache-Control: max-age=3600은 자원을 1시간 동안 캐시하도록 지시

• Expires 헤더: 자원의 만료 시간을 지정하여 캐시된 자원이 유효한 기간을 설정한다.
  • Ex) Expires: Wed, 21 Oct 2024 07:28:00 GMT는 자원의 만료 시간을 설정한다.

2. 서버 사이드 캐싱 (Server-Side Caching)

서버 사이드 캐싱은 서버에서 생성된 콘텐츠를 저장하여 요청 시 빠르게 제공하는 방법이다.

• 페이지 캐싱 (Page Caching): 전체 HTML 페이지를 캐시하여 동일한 요청에 대해 서버에서 페이지를 재생성하는 대신 저장된 페이지를 반환.
• 쿼리 캐싱 (Query Caching): 데이터베이스 쿼리의 결과를 캐시하여 동일한 쿼리에 대한 응답을 빠르게 제공한다.
  • Ex) MySQL의 쿼리 캐시 기능
• 객체 캐싱 (Object Caching): 데이터베이스 쿼리 결과나 계산된 값을 메모리에 저장하여 성능을 향상시킨다.

3. CDN 캐싱 (Content Delivery Network Caching)

CDN 캐싱은 전 세계 여러 서버에 콘텐츠를 분산하여 사용자에게 가장 가까운 서버에서 콘텐츠를 제공하는 방법이다. 

• 지연 시간 감소: 사용자와 가장 가까운 CDN 서버에서 콘텐츠를 제공하여 로딩 시간을 단축.
• 트래픽 분산: 여러 서버에 콘텐츠를 분산시켜 서버 부하를 감소시킨다.
• 자동 캐싱: CDN 서비스는 자원의 캐싱과 만료 관리를 자동으로 처리한다.

4. 프록시 캐싱 (Proxy Caching)

프록시 서버를 사용하여 클라이언트와 서버 사이의 요청과 응답을 캐시합니다.

• 역방향 프록시 캐싱 (Reverse Proxy Caching): 서버 앞단에 위치한 프록시 서버가 요청을 캐시하고, 클라이언트에게 응답을 전달합니다.
  • Ex) Nginx, Varnish 
• 전방 프록시 캐싱 (Forward Proxy Caching): 클라이언트가 요청을 프록시 서버를 통해 보내고, 프록시 서버가 요청된 자원을 캐시하여 제공하는 방식이다.

각 캐싱 기법은 웹 애플리케이션의 특정 요구 사항에 따라 적절히 조합하여 사용되며, 캐싱 전략을 효과적으로 구성함으로써 웹 페이지의 성능을 크게 개선할 수 있다!