2025.03.30
조회 664
Cloudflare 이미지 느리게 뜨는 문제 해결기 관련자료
광고
이번 글에서는 Cloudflare를 사용 중인 이미지 서버에서 특정 시간대 또는 브라우저에서 이미지가 간헐적으로 느리게 뜨는 문제를 분석하고 해결한 과정을 공유합니다.
문제 현상
- 일부 브라우저에서 이미지가 늦게 뜸
- 같은 시간에 다른 브라우저에서는 빨리 뜨는 경우도 있음
- 간헐적으로 모든 브라우저에서 느려지는 현상 발생
환경 정보
- Cloudflare 사용 중 (Tiered Cache 활성화)
- 이미지는
background-image스타일로 표시됨 - 이미지 경로는 Cloudflare 엣지를 거쳐 전달됨
문제 분석 과정
문제 발생 시 curl 명령어를 통해 응답 속도와 POP 정보를 측정했습니다.
curl POP 확인
curl -sI "https://이미지경로" | grep -i cf-ray
속도 테스트 (TTFB 및 총 다운로드 시간)
curl -w "TTFB: %{time_starttransfer}s\nTotal: %{time_total}s\n" -o /dev/null -s "https://이미지경로"
반복 테스트 (Ubuntu/Linux)
for i in {1..5}; do
echo "Try $i"
curl -w "TTFB: %{time_starttransfer}s\nTotal: %{time_total}s\n\n" -o /dev/null -s "https://이미지경로"
done
응답 예시
cf-ray: *****-FUK
TTFB: 0.179351s
Total: 0.348950s
발견된 원인
- Cloudflare POP(FUK)에서 간헐적인 디스크 캐시 응답 지연
- 브라우저 간 background-image 처리 및 WebP 디코딩 성능 차이
- 캐시가 있어도 재검증 요청으로 인해 느려지는 경우
- HTTP/3 (QUIC) 전송 중 일부 지연 발생 가능성
해결 방안
- 캐시 헤더 최적화
Cache-Control: public, max-age=604800, immutable - background-image 대신 <img> 태그 사용 권장
<div class="goods_img"> <img src="https://이미지경로" alt="썸네일" loading="lazy" class="img-fluid"> </div> - 필요한 썸네일만 preload
<link rel="preload" as="image" href="https://이미지경로"> - QUIC (HTTP/3) 비활성화 후 비교 테스트
마무리
Cloudflare의 Tiered Caching을 사용하고 있음에도 POP 내부 문제, 브라우저 렌더링 처리 차이, 재검증 요청 등으로 인해 간헐적으로 이미지가 느려질 수 있습니다. 캐시 헤더 최적화, 로딩 구조 개선, 디코딩 부담 완화 등을 통해 사용자 체감 속도를 개선할 수 있습니다.
광고
광고
글 찾아보기
55개의 글
광고
광고
