📚 Reference
📜 Chapter
‣
‣
‣
‣
‣
‣
next/image를 사용하면 이미지 크기 조정, WebP 변환, 지연 로드(Lazy Loading)등을 통해 성능을 최적화할 수 있다.
import Image from 'next/image';
<Image src="/example.jpg" alt="Example" width={800} height={600} />
외부 이미지 최적화 설정: 외부 이미지를 사용할 경우 next.config.js에서 images.domains 설정을 추가한다.
module.exports = {
images: {
domains: ['example.com'],
},
};