안녕하세요?
저녁식사 맛있게 드셨는가요? ^^
이미지 리사이징을 서버가 아닌 클라이언트에서 하는 것과 관련하여 질문 드립니다!
유저가 일정 사이즈(ex. width)를 초과하는 이미지를 업로드하는 경우
다수의 사이트에서 자동으로 리사이징을 하도록 하는 것으로 알고 있구요~
대체로 PHP의 GD나 Python의 Pillow 등 백엔드의 라이브러리를 이용하던데요 :)
제가 막연히 생각하기로는 canvas API를 활용하여
브라우저에서 미리 리사이징을 한 후에 이를 업로드한다면 다음과 같은 장점이 있을 것 같은데요~
1. 서버의 자원을 절감할 수 있음
2. 모바일 유저의 경우 아웃바운드 트래픽을 경감할 수 있음
단순히 관행적으로 백엔드에서 처리하는 것이라고 볼 여지도 있지만,
(ex. 어차피 백엔드에서 FFmpeg로 GIF -> MP4 변환을 해야하니 리사이징도 백엔드에서 처리??)
클라이언트단에서 리사이징을 하면 어떠한 단점 내지 한계가 있기 때문에
이를 백엔드에서 처리하는 것이 아닐까 하는 생각이 드네요 ^^
우선 속도의 차이 때문이 아닐까 추측해보았는데요~
제가 간단히 테스트를 해본 결과로는
백엔드에서 처리하는 것과 비교하여 체감상 속도 저하 같은 문제를 느끼지 못하겠던데요 ㅠㅠ
(물론 굉장히 주관적이고 테스트한 환경도 다양하지 못하기 때문에 일반화하기 어렵겠지만요)
그리고 구글링을 해보니 일정 버전 이상의 크로미움 기반의 브라우저를 제외하면
Bilinear interpolation을 사용하는 것으로 확인되는데요~
백엔드에서 Bicubic 또는 Lanczos interpolation을 사용하는 것과 비교할 때
어느 정도 화질의 저하가 있을 것 같긴 하네요 ㅠㅠ
위에 덧붙여 아마도 제가 미처 생각하지 못한 부분이 추가적으로 있을 것 같은데요 :)
이와 관련해서 저의 우문에 현답을 부탁드릴게요!
그럼 편안한 저녁 되세요~ ^-^
답변해주실 분께 미리 감사드립니다!!
저는 그냥 공개된 라이브러리를 이용했구요
사용자들이 스마트폰으로 모바일 데이터를 많이 이용해서 업로드 속도도 느리고
원활한 진행이 안되서 해당 작업을 하긴했네요.