canvas리사이징

Deep Dive Series/Image Resizing

[JavaScript] 이미지 리사이징, 이미지 용량 줄이기 (1) (feat. HTML5 canvas)

주의! 웹에서 간단하게 이미지 리사이징 하는 경우에는 괜찮지만 압축율과 이미지의 품질을 좀 더 고려해야한다면 이 방법이 좋지 않을 수도 있습니다! 도입 이유 : 서버 리소스 관리를 위하여 용량이 큰 이미지는 서비스 운영에 있어 리소스가 많이 들기 때문에 썸네일 작업이 필요했습니다. 원래는 서버에서 작업을 하여 모바일, 웹 클라이언트 환경 상관없이 적용하려 했습니다. 하지만 전에 경험해보았을 때 서버에서 썸네일 작업을 진행할 경우 부하가 있는 것을 확인했습니다. 그래서 이번엔 클라이언트에서 이미지 리사이징하여 서버에 보내는 방식으로 적용해보았습니다. 그중에서도 웹 클라이언트(javascript)에서 이미지 리사이징했던 방법을 공유해보려고 합니다. 적용 기술 : HTML5 Canvas javascript를 ..

날개단
'canvas리사이징' 태그의 글 목록