반응형
NextJS는 기본적으로 이미지 최적화를 제공해준다.
여기서 기본적으로 한단계 더 최적화 할 수 있는 라이브러리를 nextJS에서 추천하고 있는데 그건 sharp다
설치방법은 다음과 같다
yarn add sharp
npm install --save sharp
다른 코드를 수정할 필요없이 설치만 하게 되면 nextJS에서 제공하는 IMAGE 태그만 사용하면 자동으로 적용된다.
아래에선 image가 붙은게 적용전과 적용후다
여기서 blur 처리할 수 있는 placeholder가 있는데 현재 프로젝트에 적용하기 힘들어보이는게 있는데 좀 더 알아볼 필요가 있겠다.
반응형
'TIL' 카테고리의 다른 글
| [TIL][24.02.06] 트러블 슈팅 (0) | 2024.02.07 |
|---|---|
| [TIL][24.02.01] 온도계 문제 (0) | 2024.02.01 |
| [TIL][24.01.30] drag and drop 클래스 에러 해결 (0) | 2024.01.31 |
| [TIL][24.01.29] React, className 복수 classname 적용(clsx 라이브러리 사용) (1) | 2024.01.30 |
| [TIL][24.01.26] Project - map()으로 input 추가 삭제하기 (0) | 2024.01.27 |
