이미지 캐싱? SDWebImage vs Kingfisher

1. 이미지 캐싱

UIKit Project로 샘플 데이팅앱(매칭 앱)을 만들어보았다. 데이팅 앱의 선조와도 같은 틴더에서 하듯이 스와이프하여 like와 pass를 할 수 있도록 구현하는데, 그 카드에 모든 유저의 정보가 다 담겨져 있다.

 

보통 이미지는 url의 형태로 저장되고 요청을 하게 되는데, 그 양이 많아질 수록 로딩시간이 오래걸리고, 같은 이미지를 다시 요청하면 작업을 한 번 더 반복하는 식이 되어버린다. 또, 그에 따라서 뷰가 버벅거리는 등 사용자 경험에도 안 좋은 영향을 미친다.

 

바로 이러한 경우 이미지 캐싱을 사용하여 이미지를 비동기적으로 부르는 방법을 선택한다. 캐시는 RestAPI 블로그 글에도 이야기 했듯이 임시 저장소 같은 곳인데, 이 곳에 저장을 해두고 비동기적으로 해당 이미지가 '필요할 때에' 불러와주는 식이기 때문에 네트워크 지연을 최소화해준다.

 

2. 어떻게 하는가?

SDWebImage는 iOS에서 이미지 다운로드 및 캐싱을 처리하기 위한 오픈 소스 라이브러리이다. url 방식으로 이미지를 받아오는 것을 비동기적으로 처리하고 그 받아온 이미지를 캐싱하여 사용할 수 있게 해주는 라이브러리다.

 

사실 코드를 작성하는 것이 어려운 라이브러리는 전혀 아니기 때문에, 프로젝트의 캡쳐본과 함께 어떤 동작을 수행하는 지에 대해 간단히 코멘트 하고 마치도록 하겠다.

 

위 코드는 뷰컨트롤러에서 레이아웃을 짜는 코드이고 //SDWebImage라고 표시되어 있는 부분이 user.profileImageUrl에서 가져온 이미지 URL을 사용하여 cardImageView에 이미지를 설정하는 역할을 수행하는 코드다. 해당 URL 객체는 이미지의 원격 위치(Firebase Storage)를 나타내며, sd_setImage(with: url)은 SDWebImage 라이브러리의 메서드로, 해당 URL에서 이미지를 비동기적으로 다운로드하여 cardImageView에 나타내어주는 것이다.

 

결과적으로 위의 캡쳐(gif가 아닌 점 양해부탁드립니다)와 같이 사진이 아무런 로딩이 없이 잘 불러와지는 것을 확인할 수 있었다.

 

이미지 캐싱으로 iOS에서 선택되는 라이브러리로는 SDWebImage 이외에 Kingfisher가 있다. Kingfisher은 SDWebImage에 비해 비교적 최신의 라이브러리이며, 이미지 로딩 시 애니메이션을 보여주거나, 이미지 프리패칭(미리 이미지를 캐시에 저장해놓고 꺼내 보여줌) 기능을 제공하기 때문에 역시 인기가 많은 라이브러리이다. 

 

코드 또한 SDWebImage와 비슷하게 다음과 같이 작성하여 이미지를 불러올 수 있다.

 

private func loadImage() {
  guard let url = URL(string: //url string 자리 ) else { return }
  myImageView.kf.setImage(with: url)
}

 

간단하다고 생각될 수 있는데, 이를 제외하고도 많은 옵션들을 설정할 수 있으며, 이미지의 양이 많아지면 많아질수록, 캐시 메모리 관리 관련한 코드 또한 작성해야한다!!

 

3. 그럼 둘 다 비슷한거 아닌가? 뭘 써야 하는가?

필자는 뭔가 SDWebImage가 조금 더 오래되었으니까 더 오리지널한 것이라고 생각하여, 좀 최신의 것 같고 많이 간편해보이는 Kingfisher보다 먼저 경험하고 싶어서 SDWebImage를 사용했다. 하지만 구현을 해본 결과 둘 다 코드도 비슷하게 작성되고, 외적으로 보았을 때 뭐가 다른지 전혀 모르겠고, 성능도 환경에 따라 다르다고 하는 걸 보니 정말 크게 다른 점을 느끼지 못했다.

 

하지만 공부를 해보니, SDWebImage는 objective-C로 구현이 되어있 고 Kingfisher은 swift로 구현이 되어있기 때문에 swift환경에서 조금 더 빠른 것을 체감할 수 있다고 한다.(이건 솔직히 잘 모르겠었다, 큰 차이는 아닌것 같았다)

사용자들이 Kingfisher로 많이 넘어간 이유로 SDWebImage에서 삭제와 관련되어 이슈가 발견되었기 때문이라고 하는 블로그가 있었고 그 글을 다른 곳에서 또 많이 재생산해놓았던데 출처가 명확하지 않고, 경험해보지도 않은 부분이라 잘은 모르겠다.

아마도 최신 api이기도 하고, https://github.com/onevcat/Kingfisher 여기서 확인해보니 계속 활발한 오픈소스 라이브러리이다 보니 더 많이 애용하고 있는 것이 개인적으로 가장 그럴듯한 추론같다.