Glide vs Fresco of GIF Performance
안드로이드에서 이미지 로딩 라이브러리는 3개의 라이브러리가 주로 사용되고 있다.
Square 의 Picasso
Google(Bump-Tech) 의 Glide
Facebook 의 Fresco
오늘은 이중에서도 자체 라이브러리로 GIF 재생을 할 수 있는 2개의 성능을 비교해보고자 합니다.
Fresco 의 강점
그동안의 중론은 Fresco 는 JNI 로 이미지를 en-decoding 하기 때문에 순수 자바 라이브러리인 Picasso 나 Glide 에 비해서 그 성능이 월등히 좋은 것으로 알려져 있습니다.
그래서 GIF 까지 감안한 이미지 로딩을 사용할 시에는 Fresco 를 많이 사용하고 있습니다.
Fresco 의 약점
제가 속한 팀은 그래서 Fresco 를 애용하다가 0.8 -> 0.9 로 버전업하는 과정에서 순식간에 10% 가 넘는 오류 보고가 들어오면서 Glide 로 다시 돌아오게 되었습니다.
다시 재발한 GIF 악몽
그 과정에서 GIF 의 Loading Performance 는 꾸준히 제기된 사항인데 GIF 로딩이 정말 Fresco 보다 빠를 순 없어도 현재 수준이 최대인지에 대해서 큰 의문이 있었습니다.
좀 더 빨라져보자, Glide
그러다가 Glide 의 이슈 목록에서 GIF 의 성능을 좀 더 빠르게 할 수 있는 방법을 찾았습니다.
우선 얼마나 빨라졌는지 영상을 통해 보도록 하겠습니다.
해당 영상에 대해 Fresco 는 12 초 내외 Glide 는 7초 내외로 나오는 것을 확인하실 수 있습니다.
해당 GIF 는 11MB 입니다.
보시는 바와 같이 Glide 또한 Fresco 못지 않는 성능을 보여주고 있습니다.
왜 빨라졌을까?
그 이유는 다음의 링크에서 확인 하실 수 있습니다.
Glide’ issue : SOURCE DiskCacheStrategy faster to display than RESULT (#281)
요약하면 DiskCache 전략 중 Result 는 사이즈와 Transformation 까지 마친 결과물을 이미지로 저장하도록 하고 있습니다.
이 과정에서 GIF 는 다음과 같은 과정을 가집니다.
GIF 다운로드 -> 프레임 추출 -> 프레임 사이즈 최적화 -> 프레임 저장
그러기 때문에 GIF 는 DiskCache 전략을 SOURCE 로 지정하여 GIF 원본 파일에서 프레임을 추출 후 바로 사용하도록 가이드 하고 있습니다.
Glide 의 로딩은 다음과 같이 코드를 작성하시면 됩니다.
결론
Glide 는 간결한 설정과 좋은 성능을 목적으로 한 라이브러리 입니다.
Fresco 는 세밀한 설정과 높은 성능을 목적으로 한 라이브러리 입니다.
그 사용의 목적이 엄밀히 다르며 따라서 코드의 형태또한 매우 다릅니다.
많은 개발자들이 GIF 로 인해 Fresco 로 가는 경우가 많지만 그 안에서 JNI 호환이라는 또다른 복병에 시달리는 모습도 많이 보았습니다.
간결하고 빠른 적용이 목적이라면 Glide 를 추천하며 Glide 안에서도 GIF 에 대해 좋은 해결책이 나왔음을 알 수 있었습니다.
덧. DiskCacheStrategy.SOURCE 는 문서상 PNG/TIFF 에 약간의 성능 이슈가 있을 수 있다고 하였지만 테스트 하는 과정에서는 우려할만큼의 문제는 아니었습니다. 기본 캐싱 전략으로 SOURCE 를 사용해도 무방할 것으로 보여집니다.
Github source : https://github.com/ZeroBrain/fresco_vs_glide_of_gif
2차 테스트
6개의 다른 파일 gif 를 로드하면 어느쪽이 더 빠를 것인가?
마찬가지로 11MB gif 6개를 로드하도록 하였습니다.
Glide : 11, 16, 19, 21, 26초 에 각각 첫 frame 노출
Fresco : 30, 31, 38, 39, 39, 46 초에 각각 첫 frame 노출
마찬가지로 Glide 가 좀 더 빠른 노출을 하였습니다.
다른 형태의 GIF 재생
그런데 6개를 재생하면 했을 때 frame 재생이 조금 다른 형태를 띄고 있었습니다.
fresco 는 예정 시간에 frame 을 보여주지 못하면 skip 하는 반면 glide 는 frame 을 반드시 노출해주는 형태로 그려주고 있었습니다.
또한 fresco 는 1번에 1개의 이미지만 재생시켜주는데 glide 는 골고루 재생됨을 보실 수 있습니다.
여기에서 fresco 와 glide 의 목적이 다름을 느낄 수 있었습니다.
Fresco 는 단일 이미지를 세밀하게 설정하고 그 효과를 극대화 함에 목적이 있다면 Glide 는 이미지를 보여주는 것 자체에 목적을 두기에 간단한 사용과 보여주기에 초점을 맞춘것을 보실 수 있습니다.
결론2
한 화면에 1개의 이미지에 대해서 세밀한 설정이 필요하다면 Fresco
(ex : 웹툰, SNS 내 포토이미지)
간단하게 이미지를 보여주는게 목적이라면 Glide
(ex: RecyclerView, 작은 프로필 이미지)