Next/Image 커스텀로더로 서버 부하 줄이기
·
프로젝트 개선
안녕하세요 :) 오늘은 nextjs 서버의 이미지 최적화 기능을 직접 구현하여 프론트엔드 서버 부하를 줄이게 된 경험을 공유드리고자 합니다. nextjs 프레임워크를 사용하여 개발을 해보신 적이 있다면 next/image를 사용해보신적이 있으실겁니다.본론에 들어가기 앞서 next/image를 사용할 때 사용자에게 어떤 방식으로 이미지를 반환하는지 알려드리겠습니다.1. 브라우저가 www.your-site-url/_next/media/test.png?width=60라는 url로 이미지 요청을 한다. 2. nextjs 서버에서 위 그림과 같이 이미지를 최적화하여 반환해준다. 이 방식으로 사용자는 최적화된 이미지를 받을 수 있다는 장점이 있습니다. 하지만 이미지 처리를 위한 서버의 CPU 사용량과 서버 부하가 ..