[Android] 이미지 로딩 라이브러리 - Coil 을 알아보자!😉

JoJo Develog·2020년 4월 22일
5

Android

목록 보기
18/19
post-thumbnail
post-custom-banner

안녕하세요!

이번 포스팅은 이미지 로딩 라이브러리중 하나인 Coil에 대해 알아보겠습니다.

이미지 라이브러리라고 하면 제일 유명한 Glide, Fresco 등 많이 있지만

나름 장점이 있으니 제가 소개 해드릴까 합니다.

1. Coil??? 코일?? 넌 누구냐!🙄

https://shinycaterpie.tumblr.com/post/99332903043

저는 듣자마자 이 녀석을 떠올렸습니다.
(포켓몬스터에 등장하는 포켓몬🧲👁🧲)


Coil은 Coroutine Image Loader의 약자이며 Kotlin Coroutines(코루틴)으로 만들어진 가벼운 Android 백앤드 이미지 로딩 라이브러리입니다.
그래서 코루틴자체가 내장이 되어 있어 코루틴 라이브러리를 별도로 설치하지 않아도 되는 장점이 있습니다.
현재 Coil의 관리 주체는 InstaCart라고 하는 미국의 농작물 배송 서비스 업체에서 관리중이며 현재 자신들의 앱 서비스에 적용하여 사용 중 입니다. 그리고 인스타카트의 수석 엔지니어인 Colin White에 의해 처음 소개되었습니다.

2. 아니 Glide 같은 좋은 라이브러리가 많은데 굳이?🤔

맞습니다. 이미 업계에서는 성능과 신뢰성이 검증되고 확실하게 자리잡은 이미지 라이브러리가 많습니다.
하지만 그럼에도 불구하고 Coil에는 이러한 장점이 있습니다.

장점

  • Glide, Fresco보다 상대적으로 가볍다.

  • 코루틴이 기본이지만 메인까지는 아니며 심플함과 최소한의 보일러 플레이트(boilerplate)를 위하여 Kotlin의 기능을 활용하여 Kotlin을 잘 다룬다면 사용하기가 매우 쉽다.

  • 메모리와 디스크의 캐싱, 메모리의 이미지 다운 샘플링, Bitmap 재사용, 일시정지/취소의 자동화 등등 수 많은 최적화 작업을 수행하므로 처리 속도가 굉장히 빠릅니다.

  • 다이나믹 이미지 샘플링을 지원하며 이는 Coil에서 자동으로 알아서 처리됩니다.

  • Coil의 이미지 파이프라인(PipeLine)은 크게 세 가지로 구성됩니다.
    Mappers, Fetchers, Decoders 이러한 인터페이스를 사용하여 기본 이미지 로딩 기능을 강화하거나 재정의하고 Coil에 새로운 파일 형식에 대한 지원을 추가할 수 있습니다.

  • Kotlin으로 개발 되었으며 Coroutines, OkHttp, Okio, AndroidX Lifecycles등의 최신 라이브러리를 사용합니다.

하지만 단점 또한 명확 합니다.

단점

  • 버전이 아직 정식버전이라고는 할 수 없어서 신뢰성이 낮아 실무에서 사용하는 기업이 많이 없다.
  • 최소 Android SDK 버전 14부터 지원을 하나 최신버전에서 사용을 하는 것을 권장함.(AndroidX)
  • Kotlin을 모른다면 사용하기 어렵다.
  • 일부 기능 사용을 위해 Coroutines이 무엇인지 개념적으로 어느정도 알아야 한다.

3. 어떻게 프로젝트에 적용 할까요?🧑🏻‍💻

간단하게 초기 적용법만 설명하겠습니다.

  1. 먼저 gradle에 Coil을 추가합니다.
implementation("io.coil-kt:coil:0.10.0")
  1. ImageView로 이미지를 로딩하기 위해, Coil의 load 메서드를 사용합니다.
// 각 방식은 아래와 같습니다.
// URL
imageView.load("https://www.example.com/image.jpg")

// Resource
imageView.load(R.drawable.image)

// File
imageView.load(File("/path/to/image.jpg"))

이게 다입니다. 정말 간단하죠?

  1. 추가로 이미지 핸들링을 하려면 trailing lambda 식을 이용하여 아래와 같이 추가 설정을 할 수 있습니다.
// CircleCrop(이미지 원형으로 자르기) 예시
imageView.load("https://www.example.com/image.jpg") {
    crossfade(true)
    placeholder(R.drawable.image)
    transformations(CircleCropTransformation())
}

4가지의 Image Transformations을 제공합니다.

  • BlurTransformation
    이미지를 흐릿하게 보이기하는 가우시안 블러(Gaussian Blur)를 적용합니다.
  • CircleCropTransformation
    이미지의 중심을 기준으로 원형으로 이미지를 자릅니다. (예. 카카톡의 원형 프로필 이미지)
  • GrayscaleTransformation
    그레이스케일로 음영처리를 적용합니다.
  • RoundedCornersTransformation
    사이즈에 맞도록 이미지를 자르고 이미지 모서리를 둥글게 라운드를 적용합니다.

결론👍👍👍

직접 예제로 사용을 해보았는데 코일은 Kotlin기반의 안드로이드를 위한 가볍고 깔끔한 이미지 로딩 라이브러리 였습니다.
Kotlin 기반 이면서 최신 라이브러리가 듬뿍 적용되어 미래가 기대되는 이미지 라이브러리라고 생각하며 현재 업데이트도 활발히 이루어지고 있습니다.
성능면이나 사용성이나 다른 이미지 라이브러리에 별로라고 생각이 들지도 않네요.
하지만..... 아직까지는 국내에서 사용사례를 찾아보기 드물고 관련자료가 많이 없다보니 실무에 적용하기에는 이르지 않나 싶습니다.😭😢
그래도 한번 자신의 개인 프로젝트에 마이그레이션 하여 적용 및 사용해보는 경험 또한 나쁘지 않다고 생각합니다.😋

참고 내용
https://coil-kt.github.io/coil/
https://github.com/coil-kt/coil/blob/master/README-ko.md
https://android.jlelse.eu/taking-a-look-at-coil-217e1f02ef5e
https://hub.packtpub.com/introducing-coil-an-open-source-android-image-loading-library-backed-by-kotlin-coroutines/
https://tech.instacart.com/introducing-coil-kotlin-first-image-loading-on-android-f0fdc7a2a99e

profile
12년도부터 대학에서 안드로이드 모바일을 전공으로 시작하여 "진짜 개발자"를 꿈꾸며 개발공부를 시작했습니다. SW 개발이 재밌어서 여러 방면으로 스터디하며 현재는 새로운 환경 및 새로운 트렌드에도 유연하게 적응을 잘하는 개발자로 성장해 나가는 중입니다. 글 내용에 대한 피드백은 언제나 환영입니다!
post-custom-banner

2개의 댓글

comment-user-thumbnail
2020년 11월 20일

매일 글라이드만 쓰다가 궁금해서 봤는데 신기하네요.
잘보고 갑니다.

1개의 답글