패스잇
프론트엔드 개발 · 기초

브라우저 캐싱(Browser Caching)은 웹 성능 최적화에 어떻게 기여하나요? 그 원리에 대해 설명해 주세요.

힌트 · 브라우저 캐싱은 웹 서버에서 다운로드한 정적 리소스(이미지, CSS, JS 등)를 사용자의 로컬 저장소에 저장하여, 재방문 시 서버 요청 없이 빠르게 로드하는 기술입니다.

HTTP 헤더캐시 제어유효성 검사ETagLast-Modified

모범답안

브라우저 캐싱은 웹 성능 최적화에 아주 중요한 역할을 합니다. 웹 페이지를 처음 방문했을 때 서버에서 받아온 이미지, CSS, JavaScript 같은 정적 리소스를 브라우저가 로컬 저장소에 저장해두는 방식입니다.

다음에 같은 페이지를 방문할 때는 브라우저가 서버에 다시 요청하는 대신, 로컬에 저장된 리소스를 사용하기 때문에 훨씬 빠르게 페이지를 로드할 수 있습니다.

이때 HTTP 헤더가 중요한 역할을 합니다. Cache-Control, Expires 같은 헤더를 통해 브라우저에게 캐싱 정책을 알려줄 수 있습니다. 예를 들어, Cache-Control: max-age=3600이라고 설정하면 1시간 동안 캐시된 리소스를 사용하라는 의미입니다.

만약 캐시가 만료되었다면, 브라우저는 서버에 리소스의 유효성을 검사합니다. ETag나 Last-Modified 헤더를 사용하여 리소스가 변경되었는지 확인하고, 변경되지 않았다면 서버는 304 Not Modified 응답을 보내 브라우저가 캐시된 리소스를 계속 사용하도록 합니다. 이렇게 하면 불필요한 데이터 전송을 줄여 웹 성능을 향상시킬 수 있습니다.

읽었다면, 이제 직접 답해볼 차례예요

패스잇 앱에서 이 질문에 말로 답하면 AI가 꼬리질문까지 이어가며 1:1 코칭합니다.

함께 보는 웹 성능 최적화 면접 질문

← 웹 성능 최적화 면접 질문 전체 보기