Next/Image를 활용한 이미지 최적화
4
AI 요약

이 글은 AI가 원문을 분석하여 핵심 내용을 요약한 것입니다.

Next/Image를 활용한 이미지 최적화

이 게시물은 카카오 엔터테인먼트의 스테이지 서비스에 Next/Image를 적용하여 이미지 최적화를 진행한 경험을 공유합니다.

주요 적용 기능

  • lazy loading으로 viewport 내 이미지 로딩 최적화
  • 디바이스에 맞는 이미지 사이즈 제공
  • placeholder 기능으로 레이아웃 안정성 확보

성능 향상 결과

총 이미지 용량이 25MB에서 589KB로 줄어들고, 페이지 로딩 시간이 1.11초에서 386ms로 감소하였습니다.

연관 게시글