[Image Loader Library] Glide VS Coil 알아보자!

Android를 사용하는 많은 분들은 이미지 로딩을 처리할 때 Glide를 사용할 것이라고 생각합니다. 그래서 오늘은 새로운 Coil에 대해 소개해보고자 합니다!

 

1. Coil은 뭐지??

Coil은 Coroutine Image Loader의 약자로 Kotlin Coroutine으로 만들어진 가벼운 Android 이미지 로딩 라이브러리입니다.

코일에서는 총 4가지 장점을 위주로 소개하고 있습니다.

• Fast
  • Coil performs a number of optimizations including memory and disk caching, downsampling the image in memory, automatically pausing/cancelling requests, and more.
  • 코일은 메모리 및 디스크 캐싱, 메모리의 이미지 downsampling, 자동 중지/취소 요청 등 다양한 최적화를 수행합니다
• Lighweight
  • Coil adds ~2000 methods to your APK (for apps that already use OkHttp and Coroutines), which is comparable to Picasso and significantly less than Glide and Fresco.
  • Coil은 2000개의 메서드를 APK(이미 OkHttp와 Coroutines를 사용하는 앱)에 추가합니다. 이는 Ficasso와 비슷하며 Glide와 Fresco보다 훨씬 작습니다
• Easy to use
  • Coil's API leverages Kotlin's language features for simplicity and minimal boilerplate.
  • 코일의 API는 코틀린의 단순성과 최소한의 boilerplate으로 영향을 미친다
• Modern
  • Coil is Kotlin-first and uses modern libraries including Coroutines, OkHttp, Okio, and AndroidX Lifecycles.
  • 코일은 Kotlin친화적이고 Coroutines, OkHttp, Okio, AndrodiX Lifecycles를 포함한 최신 라이브러리들을 사용합니다

 

20년도 Coil 글을 보면 아직 정식버전이 아니라 신뢰성이 낮다는 글이 있는데 현재 coil은 2.2 버전으로 많이 업데이트 된 것을 확인할 수 있었습니다! 그리고 Android CodeLab에서도 "Coil 라이브러리를 사용하여 웹 URL에서 이미지를 로드하고 표시하는 방법" 이라며 Jetpack에서 이미지 로드할 때의 학습 예시로 Coil을 사용하기도 했습니다.

또한 사용 요구사항이 Min SDK 14+ 에서 21+로 변경되었습니다.

• Min SDK 21+
• Java 8+

 

2. Coil의 사용방법

Dependency 추가

앱 단위 build.gradle 파일에 다음 코드를 추가합니다.

implementation("io.coil-kt:coil:2.2.2")

 

이미지 불러오기

Glide보다 훨씬 간단하게 .load를 붙여주면 이미지 로딩이 됩니다.

// URL
imageView.load("https://www.example.com/image.jpg")

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

// And more...

 

 

3. Glide vs. Coil 메모리 사용량 비교 (작성 중)

기기: 

 

Glide 테스트코드

fun loadImageWithGlide(imageView: AppCompatImageView, imageUrl: String, funcName: String) {
        Log.d("ImageProcessTime", "$funcName glide 시작")
        val glideStartTime = System.currentTimeMillis()

        Glide.with(this)
            .load(imageUrl)
            .listener(object : RequestListener<Drawable> {
                override fun onLoadFailed(
                    e: GlideException?,
                    model: Any?,
                    target: Target<Drawable>?,
                    isFirstResource: Boolean,
                ): Boolean {
                    return false
                }

                override fun onResourceReady(
                    resource: Drawable?,
                    model: Any?,
                    target: Target<Drawable>?,
                    dataSource: DataSource?,
                    isFirstResource: Boolean,
                ): Boolean {

                    val glideEndTime = System.currentTimeMillis()
                    Log.d("ImageProcessTime", "$funcName processTime: ${(glideEndTime - glideStartTime) / 1000}")
//                    Log.d("check@@@", "${resource} ${model} ${target} ${dataSource} ${isFirstResource}")
                    return false
                }
            })
            .into(imageView)
    }

 

Coil 테스트코드

fun loadImageWithCoil(imageView: AppCompatImageView, imageUrl: String, funcName: String) {
        Log.d("ImageProcessTime", "$funcName Coil 시작")
        val coilStartTime = System.currentTimeMillis()

        imageView.load(imageUrl) {
            crossfade(true)
            listener { request, result ->
                val coilEndTime = System.currentTimeMillis()
                Log.d("ImageProcessTime", "$funcName processTime: ${(coilEndTime - coilStartTime) / 1000}")

            }
        }
    }