Next.js 이미지 최적화 실험

로딩 전략 축(A,B,D)과 Next.js 추가 최적화 축(C,E)을 분리해 비교한다.

A. <img> baseline

원본 요청, srcset/format 변환 없음, eager 중심

B. <img loading="lazy">

native lazy loading만 적용한 순수 request delay 비교

C. <Image /> default

format 변환/기본 최적화 확인(단, sizes는 제외)

D. <Image priority />

LCP 대상 preload/eager fetch 동작 비교

E. <Image /> + sizes

responsive 이미지 선택 정확도(srcset 활용도) 비교