Immutable Caching 을 통한 웹 성능 최적화

Source

  • Evernote/Inbox/Using Immutable Caching To Speed Up The Web ★ Mozilla Hacks – the Web developer blog.md

Summary

이 문서는 HTTP 응답 헤더에 Cache-Control: immutable을 사용하여 웹 페이지 리로드 성능을 극대화하는 방법을 설명합니다. Firefox 49 에서 도입된 이 기능은 리소스가 절대 변경되지 않음을 브라우저에 알려, 페이지 새로고침 시 서버와의 재검증(revalidation) 요청을 생략하게 합니다. Facebook 의 사례를 통해 리로드 시 네트워크 요청이 약 83%(150 개에서 25 개로 감소) 줄어들고 페이지 로딩 시간이 절반 이상 단축되는 효과를 보였습니다. 또한 BBC 는 리로드 시간을 최대 50% 단축하고 요청의 90% 를 최적화했으며, IPFS 와 Squid proxy 등에서도 채택되었습니다. 이 방식은 서버의 대역폭과 CPU 사용량을 절감하고, IETF 표준으로 채택되어 권장됩니다.

Key Points

  • Cache-Control: immutable 헤더는 리소스가 변경되지 않음을 명시하여 브라우저가 서버 재검증(304 응답 등)을 건너뛰게 합니다.
  • Facebook 적용 사례: 페이지 리로드 시 네트워크 요청이 150 개에서 25 개로 감소하며, 로딩 시간이 약 50% 단축되었습니다.
  • BBC 적용 사례: 리로드 시간 최대 50% 개선, 전체 요청 중 90% 가 최적화되었습니다.
  • 서버 부하 감소: 불필요한 요청 차단으로 대역폭과 CPU 사용량이 절감됩니다.
  • 표준화 및 채택: IETF 표준 트랙에 포함되었으며, IPFS, Squid proxy 등 다양한 시스템에서 채택 중입니다.
  • 적용 대상: JavaScript, 폰트, 스타일시트, 이미지 등 URI 버전닝과 함께 사용되는 정적 리소스에 효과적입니다.