안드로이드 이미지 로딩 최적화

안드로이드 자바 코틀린 기초 지식/안드로이드 기초 지식

안드로이드 이미지 로딩 최적화

Everyday Growing Engineer 2022. 9. 5. 18:53

네이버의 안드로이드 개발자 모집글을 보니 '이미지 로딩 및 최적화 경험이 있는 분' 이라는 부분이 있었다.

그래서 이미지 로딩 부분은 Glide란 라이브러리가 있다는 정도만 알았는데 뭐가 더 있는지 좀더 자세히 공부해봐야겠다.

시작하기 앞서 손실 압축과 무손실 압축의 간단한 내용정리 :

손실 압축 VS 무손실 압축

압축은 데이터 크기를 줄여서 저장공간을 더욱더 잘 활용하기 위한 기술이다.
파일을 압축할 때에는 압축 알고리즘을 사용 압축된 파일을 손상 없이 원래대로 되돌릴 수 있다면 이를 비손실 압축(Lossless Data Compression)
원래대로 복원할 수 없다면 손실 압축(Loss Data Compression)이라 한다.

우선순위 :

손실 압축 : 크기 > 품질
비손실 압축 : 크기 < 품질

안드로이드에서 사용 가능한 이미지 포멧

PNG :

무손실 압축으로 사용하는 이미지 파일 형식.
(장점) 256색에 한정된 GIF의 한계를 극복하여 32비트 트루컬러를 표현할 수 있게 되었다. 투명도 사용가능
(단점) PNG는 GIF에서 제공하는 애니메이션 기능은 제공하지 못한다.
더불어 GIF가 제공하는 '투명 배경'은 이 형식에서도 지원된다

JPEG :

JPEG(Joint Photographic Experts Group)은 손실 압축 기술을 사용하는 이미지 파일 형식이다.
손실 압축이란 원본 파일의 용량을 줄이기 위해 고의적으로 이미지를 손실시키는 것이다.
JPEG는 사진 배경을 투명화 시켜도 안드로이드에서 투명으로 인식하지 못한다. (안드로이드에서 투명화된 이미지파일을 불러오고 싶을 땐 배경을 투명화 시킨 png 사진을 가져오면 된다.)

GIF :

그래픽 인터체인지 포맷(Graphics Interchange Format; GIF)는 비트맵 그래픽 파일 포맷이다.
최대 256 색까지 저장할 수 있는 비손실 압축 형식이다

WebP :

WebP(Web + Picture)라는 단어에서 알 수 있듯이 웹에서 사용되는 기존의 GIF, JPG, PNG 이미지 포맷을 대치하기 위해 구글에서 만든 이미지 포맷.
WebP의 가장 큰 장점은 같은 품질의 이미지를 만들 때 기존의 이미지 포맷보다 파일 크기가 더 작아집니다. API 18 이상에서부터 손실 압축과 무손실 압축을 모두 지원. 이전 버전에서는 손실 압축만 가능.
WebP를 사용하면 JPG는 기존 대비 25~34%, PNG는 비손실의 경우 평균 26%(손실 방식의 경우 60~70%) 정도 기존 파일 대비 작아집니다. 특히 움짤의 경우 기존의 GIF를 동일한 화질의 WebP로 변경하면 파일 크기가 절반 이하로 줄어들기도 합니다.

9-Patch :

안드로이드는 기본적으로 이미지뷰를 할당한 뒤 이미지를 넣게 되면 이미지뷰의 사이즈에 맞춰지게 된다. 하지만 원본 이미지와 뷰의 크기가 다르게 되면 이미지가 늘어나서 깨지게 된다.
이를 방지하기 위해 이미지의 크기가 달라질 때 왜곡되는 부분과 왜곡되지 않는 부분을 나누어 처리할 수 있도록 만든 기능이 나인패치 이미지이다.
참고문헌: https://ju-hy.tistory.com/32

비트맵(Bitmap)과 벡터(Vector) 이미지:

벡터(Vector) 그래픽 :

벡터 이미지는 점과 점을 연결해 수학적 원리로 그림을 그려 표현하는 방식을 말합니다. 벡터 이미지는 그 특성 상 이미지의 크기를 늘리고 줄여도 손상되지 않는 장점이 있지만, 사진과 같은 복잡한 그림을 표현하려면 컴퓨터에 엄청난 부담을 주곤 했기에 웹에서는 잘 사용되지 않았습니다.
자주 접할 수 있는 벡터 파일의 형식에는 .ai, .eps, .svg 가 있습니다.

bmp :

비트맵 그래픽은 간단히 말해 서로 다른 점(픽셀)들의 조합으로 그려지는 이미지 표현 방식입니다. 비트맵 이미지는 정교하고 화려한 표현이 가능하여, 주로 사진 이미지에 주로 사용됩니다. 비트맵 이미지는 크기를 늘리거나 줄이면 원본 이미지에 손상이 가는 것이 특징이며, 우리는 흔히 이것을 '이미지가 깨졌다'라고 표현합니다.
비트맵 이미지는 이미지를 표시하는 방식에서 컴퓨터에 부담을 덜 주는 구조를 갖고 있기 때문에, 웹에서 이미지를 표시할 때는 주로 비트맵 이미지를 사용합니다. 우리가 흔히 보고 다루는 .jpg, .jpeg, .png, .gif 가 모두 비트맵 방식입니다.

보통 PNG 나 BMP 를 권장하며, JPG 나 GIF 는 사용하지 않는 것이 좋습니다.

안드로이드에서 이미지 로딩 방법 :

직접 이미지 로딩을 구현
이미지 라이브러리를 사용
- Glide :
  - 구글이 공개를 한 이미지 라이브러리. 안드로이드의 빠르고 효과적인 오픈소스 미니어 매니지먼트 및 이미지 로딩 프레임워크
  - 장점 : 속도가 빠르고 사용법이 간편하다. 캐시를 위해 적은 양의 메모리를 사용. Gif, 애니메이션 default처리 등 다양한 부가 기능이 필요할 때 사용한다. 안드로이드 공식에서 추천하는 라이브러리.
  - 단점 : 라이브러리 크기가 상당히 크다.
- Picasso :
  - Picasso는 Glide가 등장하기 전 안드로이드에서 이미지 로딩을 위해 사용되어지던 라이브러리입니다.
  - 장점 : 라이브러리가 메모리도 적게 차지한다. 사용법이 가장 쉽다.
  - 단점 : Glide와 Fresco보다는 속도가 느리다. gif는 사용할 수 없다. 기본 이미지 캐시가 크기 때문에 빠른 로딩을 원하면 resize 작업을 해야한다.
  - 많은 대용량 이미지 처리를 할 필요없는 앱에 가장 적합하다.
- AUIL (Android Universal Image Loader)
  - Android Universal Image Loader(이하 AUIL)는 많은 앱에 적용되어 있고, 화면 크기를 기준으로 캐시 용량을 제한하는 등 다양한 캐시 정책을 지원한다. Executor, 스레드 풀 크기, , Bitmap Options 등 변경할 수 있는 옵션이 많습니다.
  - 출처: https://iw90.tistory.com/113 [woong's:티스토리]
- Fresco
  - 페이스북이 만든 안드로이드 이미지 라이브러리
  - 장점 : 속도가 가장 빠르다.
  - 단점 : 사용법이 어렵다. ImageView 대신 DraweeView를 사용해야 한다. (DraweeView는 wrap_content를 지원하지 않으므로 url 요청시 이미지 크기를 정확히 알고있어야 한다)
  - 대용량 이미지 처리를 하는 앱에 적합하다. (+ 숙련된 개발자)

직접 구현시 고민해볼 문제 :

이미지 로딩 라이브러리를 직접 구현하기 위해선 안정적인 HTTP 통신 OOM을 회피하는 비트맵 디코딩 메모리/디스크 캐싱 병렬처리 실패처리 등의 내용을 고민해야 합니다 (링크)

Library 성능 비교