Canvas API
-
[Javascript] 이미지 리사이징으로 용량 줄이기 (Canvas API)Java Script 2024. 3. 27. 13:43
최근에 대한민국 철봉 지도라는 프로젝트를 진행하면서 사용자가 지도에 철봉 위치를 등록하면서 주변 사진을 이미지로 업로드하고, 업로드한 이미지를 다른 사용자들이 확인할 수 있는 기능을 구현하였습니다. 이때 저희 서비스 특성상 고화질 이미지를 제공할 필요성이 크지 않고, 거리뷰를 통해 확인할 수 있는 기능을 제공함으로써 서버의 부담을 줄이고, 로딩 속도를 올리기 위해 이미지를 리사이징 하여 용량을 줄이기로 결정하였습니다. | react-image-file-resizer 먼저 이미지를 리사이징 react-image-file-resizer라는 라이브러리를 활용해 보기로 했습니다. https://www.npmjs.com/package/react-image-file-resizer react-image-file-re..