본문 바로가기
IT/소프트웨어

🚀 웹사이트 느린 이유? 캐싱만 제대로 해도 속도 2배 빠릅니다

by DrKo83 2025. 10. 29.
300x250
반응형

 

여러분, 혹시 웹사이트 열 때 빙글빙글 돌아가는 로딩 화면 보면서 짜증난 적 있으시죠? 사실 그 느린 속도의 범인은 바로 캐싱 설정 문제일 확률이 엄청 높아요. 오늘은 웹 성능의 숨은 영웅, HTTP 캐싱에 대해 깊이 있게 파헤쳐볼게요.

캐싱, 왜 이렇게 중요한 걸까요?

캐싱이라는 게 뭔지부터 쉽게 설명드릴게요. 자주 쓰는 물건을 책상 서랍에 넣어두는 것처럼, 자주 사용하는 데이터를 가까운 곳에 저장해두는 거예요. 매번 창고까지 가서 가져올 필요 없이 바로 꺼내 쓸 수 있잖아요?

구글이 2023년에 발표한 연구 결과를 보면 정말 놀라워요. 페이지 로딩 속도가 단 1초만 늦어져도 전환율이 7%씩 떨어진다고 해요. 이게 무슨 의미냐면, 쇼핑몰이라면 매출이 7%씩 날아간다는 거예요. 근데 제대로 된 캐싱 설정만으로도 로딩 속도를 50% 이상 개선할 수 있다니, 안 할 이유가 전혀 없죠?

실제로 어떤 효과가 있을까요?

속도 개선이 가장 눈에 띄는 효과예요. 브라우저 메모리 캐시는 거의 즉각적으로 반응해요. 네트워크를 왔다 갔다 하는데 걸리는 100~300밀리초를 완전히 없앨 수 있거든요. 한 페이지에 이미지, 자바스크립트, CSS 파일이 수십 개씩 있다고 생각해보세요. 이 차이가 정말 엄청나게 체감되실 거예요.

클라우드플레어가 2024년에 공개한 통계 자료를 보면 더 놀라워요. 캐시 적중률을 80% 수준으로 유지하는 사이트들은 서버 부하가 무려 1/5로 줄어들었대요. 실제로 한 스타트업은 월 200만 원 정도 나가던 인프라 비용을 40만 원대로 낮췄다고 해요. 이게 바로 비용 절감의 힘이에요.

안정성 측면에서도 캐싱은 생명줄이에요. 작년 블랙프라이데이 때 한국의 한 이커머스 사이트는 평소보다 20배나 많은 트래픽이 몰렸는데도 CDN 캐싱 덕분에 문제없이 서비스를 제공했어요. 반면 비슷한 규모인데 캐싱 설정이 제대로 안 된 곳은 서버가 다운되는 대형 사고를 겪었죠.

SEO에도 직접적인 영향을 미쳐요. 구글 검색봇은 캐싱 헤더를 보고 크롤링 빈도를 조절하거든요. 헤더가 명확하면 더 효율적으로 크롤링하고, 신선한 콘텐츠를 빠르게 색인할 수 있어요. 결국 검색 순위에도 긍정적인 영향을 주는 거죠.

캐싱은 어디서 일어날까요?

캐싱은 한 곳에서만 일어나는 게 아니라 여러 단계에서 동시다발적으로 일어나요.

제일 가까운 곳은 브라우저 캐시예요. 크롬이나 사파리 같은 브라우저들은 메모리 캐시와 디스크 캐시를 모두 활용해요. 메모리 캐시는 탭을 닫으면 사라지지만 속도가 정말 빠르고, 디스크 캐시는 브라우저를 껐다 켜도 남아있어요.

다음 단계는 CDN이에요. 클라우드플레어는 2024년 기준으로 전 세계 웹 트래픽의 약 20%를 처리하고 있어요. 전 세계 330개 이상의 도시에 데이터 센터를 운영하면서 콘텐츠를 사용자 가까이에 복사해두죠. 한국 유저가 미국 서버에 있는 파일을 요청하면, 서울에 있는 CDN 서버가 대신 응답하는 거예요.

아마존 클라우드프론트는 2024년 기준 600개 이상의 엣지 로케이션을 운영하고 있어요. 네이버 클라우드는 한국 내에서만 10개 이상의 CDN 거점을 운영하면서 특히 국내 서비스에 최적화된 성능을 제공하고 있죠.

회사나 ISP의 프록시 서버도 중간에서 캐싱을 담당해요. 특히 대기업 사내망이나 SKT, KT 같은 통신사 네트워크에서 활발하게 사용되고 있어요.

마지막으로 애플리케이션 레벨에서도 캐싱이 일어나요. 레디스는 2024년 기준 전 세계 10만 개 이상의 기업에서 사용되고 있고, 특히 네이버와 카카오 같은 대형 포털에서 핵심 인프라로 활용되고 있어요.

캐시 키의 비밀

캐시가 두 요청이 같은 건지 다른 건지 판단하려면 기준이 필요한데, 이게 바로 캐시 키예요.

기본적으로는 URL의 스킴, 호스트, 경로, 쿼리 스트링으로 구성돼요. 하지만 최신 브라우저들은 더블 키잉, 트리플 키잉이라는 방식으로 보안과 프라이버시를 강화하고 있어요. 크롬은 86버전부터 이 기능을 기본 활성화했고, 사파리는 이미 2019년부터 적용했어요. 같은 구글 폰트 파일이라도 사이트 A에서 쓸 때와 사이트 B에서 쓸 때를 구분하는 거죠.

Vary 헤더가 추가적인 복잡성을 만들어내요. Accept-Encoding 헤더에 따라 gzip 압축 버전과 brotli 압축 버전을 따로 저장하거나, Accept-Language에 따라 한국어 버전과 영어 버전을 나눠서 캐싱할 수 있거든요.

문제는 너무 세밀하게 나누면 캐시가 파편화된다는 거예요. 쿠키 값마다 다른 캐시를 만들면 수천 개로 쪼개지겠죠? 이렇게 되면 캐시 적중률이 형편없어져요.

신선도를 어떻게 관리할까요?

캐시된 콘텐츠를 그냥 써도 되는지, 아니면 서버에 확인해야 하는지가 캐싱의 핵심 질문이에요.

Cache-Control 헤더의 max-age가 가장 중요해요. 예를 들어 max-age=300이면 300초 동안은 신선하다고 보고 그냥 써요. 시간이 지나면 서버에 확인하죠.

이때 ETag나 Last-Modified 같은 검증자를 쓰면 효율적이에요. 전체 파일을 다시 받는 게 아니라 "이 버전 맞아요?"라고만 물어보면 되거든요. 변경이 없으면 서버는 304 Not Modified를 보내고, 캐시된 버전을 계속 쓰면 돼요. 넷플릭스는 이 방식으로 전 세계 CDN 트래픽의 약 90%를 절감하고 있어요.

흔히 착각하는 것들

no-cache가 캐싱하지 말라는 뜻이 아니에요. 사실은 저장은 하되 매번 검증하라는 의미거든요. 진짜 저장하지 말라는 건 no-store예요.

max-age=0과 must-revalidate도 비슷해 보이지만 완전히 달라요. max-age=0은 즉시 만료된다는 뜻이고, must-revalidate는 만료되면 반드시 재검증하라는 거예요.

s-maxage는 CDN 같은 공유 캐시에만 적용되는 특별한 max-age예요. 브라우저에는 max-age=60으로 짧게, CDN에는 s-maxage=600으로 길게 설정할 수 있죠.

immutable은 파일이 절대 변하지 않는다는 뜻이에요. app.9f2d1.js처럼 버전이 파일명에 박혀있을 때만 써야 해요. HTML 같은 곳에 쓰면 유저가 몇 달 동안 오래된 버전을 보게 될 수 있어요.

실전에서 어떻게 쓸까요?

정적 파일인 자바스크립트, CSS, 폰트는 이렇게 설정하세요. Cache-Control: public, max-age=31536000, immutable

파일명에 버전 해시가 들어가있으면 1년 동안 캐싱해도 안전해요. 네이버는 이 방식으로 정적 리소스를 관리하면서도 업데이트가 필요하면 파일명만 바꿔서 즉시 반영하고 있어요. 실제로 네이버 메인 페이지의 자바스크립트 파일을 보면 main.a3f2b1.js 같은 형태로 되어 있죠.

HTML 문서는 상황에 따라 달라요. 뉴스 사이트처럼 자주 바뀌는 곳이라면 이렇게 설정하세요. Cache-Control: public, max-age=60, s-maxage=300, stale-while-revalidate=60, stale-if-error=600

브라우저는 1분마다, CDN은 5분마다 체크하되, 약간 오래된 버전을 보여주면서 뒤에서 새로 가져오는 방식이에요. 조선일보와 중앙일보 같은 주요 언론사들이 이런 전략을 사용하고 있어요.

블로그나 문서 사이트처럼 덜 바뀌는 곳은 이렇게요. Cache-Control: public, max-age=300, s-maxage=86400, stale-while-revalidate=300, stale-if-error=3600

CDN에서 하루 동안 캐싱하고, 글을 수정하면 CDN을 수동으로 갱신하는 거죠. 티스토리나 워드프레스에서 많이 쓰는 방식이에요.

API는 이렇게 설정하면 좋아요. Cache-Control: public, s-maxage=30, stale-while-revalidate=30, stale-if-error=300

배달의민족은 메뉴 정보 API를 30초간 CDN에서 캐싱해요. 이것만으로도 피크 시간대 서버 부하가 80% 이상 줄어들었다고 해요. 쿠팡이츠도 비슷한 전략으로 하루 수억 건의 API 호출을 효율적으로 처리하고 있죠.

로그인한 유저 페이지는 절대 공유 캐시에 두면 안 돼요. Cache-Control: private, no-cache

브라우저에만 저장하되 매번 검증하게 해야 개인정보 유출을 막을 수 있어요.

클라우드플레어 제대로 쓰기

클라우드플레어는 2024년 기준 하루 평균 70조 건 이상의 요청을 처리하고 있어요. 한국에서도 쿠팡, 배달의민족, 토스를 비롯한 많은 기업들이 사용하고 있죠.

기본 설정에서 클라우드플레어는 HTML을 캐싱하지 않아요. CSS나 자바스크립트만 캐싱하죠. 이걸 모르고 "왜 서버 부하가 안 줄지?"라고 고민하는 분들이 정말 많아요.

Cache Everything 옵션을 켜면 HTML도 캐싱되지만, 로그인 페이지까지 캐싱되는 대형 사고가 날 수 있어요. 실제로 2023년 한 스타트업은 이 실수로 유저 A가 로그인했는데 유저 B의 정보가 보이는 심각한 개인정보 유출 사고를 겪었어요. 쿠키가 있을 때는 캐시를 우회하도록 규칙을 만드는 게 안전해요.

클라우드플레어의 Edge Cache TTL 설정은 여러분의 원본 헤더를 무시하고 CDN 레벨에서 캐싱 시간을 강제해요. 브라우저는 여러분의 max-age를 보지만, CDN은 Edge Cache TTL을 따르는 거죠.

쿼리 스트링도 정말 조심해야 해요. utm_source 같은 마케팅 파라미터 하나 때문에 캐시가 수백 개로 쪼개질 수 있거든요. 클라우드플레어에서 무시할 파라미터를 설정하면 적중률이 30~40% 이상 올라가요.

AI 시대에 캐싱이 더 중요한 이유

요즘은 사람만 여러분 사이트를 보는 게 아니에요. 구글 검색봇, ChatGPT 학습 크롤러, 쇼핑 비교 에이전트까지 다양한 AI가 여러분 사이트를 방문하고 있어요.

오픈AI가 2024년에 공개한 데이터를 보면, 캐싱 헤더가 명확한 사이트는 그렇지 않은 곳보다 3배 더 자주 크롤링됐대요. GPT-4o의 학습 데이터에 포함될 확률도 훨씬 높았고요.

반대로 no-store만 남발하면 AI 학습 데이터에서 여러분 사이트가 빠지거나, 불완전하게 반영될 수 있어요. 요즘 AI 시대에는 검색 노출만큼이나 AI 노출도 중요하잖아요?

구글의 Gemini AI는 2024년부터 캐싱이 잘 된 사이트를 더 신뢰할 만한 출처로 판단하기 시작했어요. 기술적 완성도가 높은 사이트가 콘텐츠 품질도 높다고 보는 거죠.

디버깅은 이렇게 하세요

캐싱 문제를 찾으려면 체계적으로 접근해야 해요.

크롬 개발자도구 네트워크 탭을 열면 각 리소스가 memory cache, disk cache, 아니면 실제 네트워크에서 왔는지 볼 수 있어요. Size 컬럼에 memory cache나 disk cache라고 표시되면 캐싱이 잘 되고 있는 거예요.

Age 헤더는 그 응답이 캐시에 얼마나 오래 있었는지 보여줘요. 0이면 방금 원본에서 가져온 거고, 300이면 5분 동안 캐시에 있었다는 뜻이죠.

cf-cache-status 같은 CDN 헤더는 HIT, MISS, EXPIRED, BYPASS 같은 상태를 알려줘요. 계속 MISS만 나온다면 뭔가 잘못 설정된 거예요. 실제로 한 쇼핑몰은 MISS율이 90%였는데, 쿼리 스트링 설정만 바꿔서 HIT율을 85%까지 올렸어요.

진짜 실수하기 쉬운 게, 개발자도구에서 Disable cache를 켜놓고 테스트하는 거예요. 이 상태로는 모든 캐싱이 비활성화되니까 실제 유저 경험과 완전히 달라요. 테스트할 때는 꼭 꺼두세요.

여러 캐시 레이어의 함정

진짜 복잡한 건 여러 캐시가 동시에 작동할 때예요.

예를 들어볼게요. 여러분이 레디스에서 상품 가격을 업데이트했어요. 근데 Varnish 리버스 프록시는 5분 전에 캐싱한 HTML을 가지고 있고, 클라우드플레어는 10분 전 버전을, 유저 브라우저는 15분 전 버전을 가지고 있을 수 있어요.

이런 상황에서 누가 뭘 보느냐에 따라 가격이 다 다르게 보이는 거죠. 쿠팡은 이 문제를 해결하려고 캐시 태그 시스템을 도입했어요. 상품 하나를 업데이트하면 관련된 모든 캐시를 한 번에 무효화하는 거죠. 2023년 공개 자료에 따르면 이 시스템으로 가격 불일치 문제를 99.9% 해결했다고 해요.

11번가도 비슷한 시스템을 운영하는데, 상품 업데이트 후 평균 2초 이내에 모든 캐시 레이어가 동기화된다고 해요. 이게 가능한 건 캐시 무효화 우선순위를 정밀하게 관리하기 때문이죠.

한국 유저들의 높은 기준

특히 한국처럼 빠른 인터넷 환경에 익숙한 유저들은 1초만 느려져도 떠나버려요. 카카오가 2023년에 발표한 연구를 보면, 한국 유저들의 페이지 이탈 기준 시간이 2초래요. 미국이 3초, 일본이 2.5초인 걸 생각하면 정말 짧죠.

네이버는 이런 국내 유저 특성을 고려해서 메인 페이지 로딩 시간을 0.8초 이내로 유지하고 있어요. 쿠팡도 상품 페이지 로딩 시간을 1초 이내로 관리하면서 전환율을 지속적으로 개선하고 있죠.

마무리하며

캐싱은 선택이 아니라 필수예요. 제대로 설정하지 않으면 느리고, 비싸고, 불안정한 사이트가 되고, 잘 설정하면 빠르고, 저렴하고, 믿을 수 있는 사이트가 돼요.

캐싱은 기술적인 디테일이 아니라 비즈니스 전략이에요. 더 빠른 사이트, 더 낮은 비용, 더 안정적인 서비스, 더 나은 SEO. 이 모든 게 캐싱 하나로 동시에 해결될 수 있어요.

여러분 사이트의 캐싱 설정, 오늘 한 번 점검해보시는 건 어떠세요?

 

300x250
반응형