Next.js (1) 썸네일형 리스트형 [Next.js] next/image로 이미지 최적화하기 Next.js환경에서 제공하는 next/image의 장점에 대해서 알아보자 리액트로 이미지를 렌더링할 경우 loading="lazy" 설정을 추가하여 특정 treshold를 넘어갈 경우 이미지가 로딩되도록 설정할 수 있다. 📌 next/image를 이용하여 이미지 연결하기 ◼️ 이미지 소스를 static하게 import한 경우 import Image from "next/imgae"; import example from "/public/example.jpg" // 이미지 소스 파일을 static하게 import한 경우 ◾️ 이미지 소스를 외부 링크로 연결한 경우 // 이미지 소스 파일을 외부 링크로 연결할 경우 // error !! 하지만 이미지를 외부 링크로 연결한 경우 이미지의 사이즈를 명확히 알지 못.. 이전 1 다음
