Loading large images faster in UIImageView

Question

Created Jul ’18

Replies 4

Boosts 0

Views 4.5k

Participants 3

Is there an accepted way, or updated way, to more quickly load images into a UIImageView.

My scenario: A collection view, with a large UIImageView. Only 1 cell is displayed at a time. I have implemented NSCache and Prefetching on the collection view already. Performance on scrolling has a pause partway through. The images I am using are "relatively" large, in order to accomodate both an iPad and iPhone layout. For example, images are 1600x1600px, RGB, PNG.

Once the images are loaded, scrolling back and forth is usually OK then, ~60fps visually. But on first load they are ALWAYS jittery. BUT if I make the images physically smaller, such as 800x800 then they load quickly and I can not see a jitter on scroll. So I am dealing with an image size vs speed issue. Same issue seen on a 5s as on an iPhone X.

I am reading how UIImages are decompressed before actually being drawn, and if the system has to draw a subsampled image, it can significantly affect main thread performance. I've done a little Instruments testing and confirmed that it appear that none of my code is actually slow, the image drawing of a PNG is slow.

Is there a newer way to do something similar to the content in links below?

https://www.cocoanetics.com/2011/10/avoiding-image-decompression-sickness/

https://gist.github.com/steipete/1144242

this seems like real overkill for me:

https://github.com/path/FastImageCache

Answered by CorvetteDev in 325548022

My solution was to replace PNG images with JPG images. Then the image loading was "fast/instantaneous" and had no noticeable stutter.

I was using 1 large asset in order to try to keep app file size down, instead of supplying 2 assests (one for iPhone one for iPad). Plus iPhone X has pixel dimension almost a similar pixel dimension as an iPad. These are static assets in a game, and "expanding them up" with "more info i button" is not a thing.

The image sizes were compressed to ~300kb, but PNG compressed depends on the content (so does JPG). The DPI doesn't matter just the raw pixel size.

Yes I did mean to say 60fps, as in the view scrolling was smooth, as compared to ~15fps which would appear jittery, or "stuttering".

So I think yes the image size and compression was the culprit, and JPG is a faster choice to decode the image, especially that they were photographic and not smooth-type-graphics.

Thanks for the suggestions.

Boost

Answer 1

Claude31 OP

Aug ’18

1600 * 1600 to display in tableView seems overkill

What I would try:

- get low res images (200 * 200 typical): that will load 60 times faster and use much less memory

- use them in tableView

- show full resolution when peeking or pressing ℹ button.

0

Answer 2

KMT OP

Aug ’18

'fps' is a video playback metric, not an image asset viewing metric, unless you're just making a seat-of-the pants observation, in which case, whatever...

What is their dpi?

Are you scaling? Are you using asset catalog?

prefetching w/collectionview should work, I think you just need to whittle those images back, instead.

0

Answer 3

CorvetteDev OP

Aug ’18

Accepted Answer

My solution was to replace PNG images with JPG images. Then the image loading was "fast/instantaneous" and had no noticeable stutter.

I was using 1 large asset in order to try to keep app file size down, instead of supplying 2 assests (one for iPhone one for iPad). Plus iPhone X has pixel dimension almost a similar pixel dimension as an iPad. These are static assets in a game, and "expanding them up" with "more info i button" is not a thing.

The image sizes were compressed to ~300kb, but PNG compressed depends on the content (so does JPG). The DPI doesn't matter just the raw pixel size.

Yes I did mean to say 60fps, as in the view scrolling was smooth, as compared to ~15fps which would appear jittery, or "stuttering".

So I think yes the image size and compression was the culprit, and JPG is a faster choice to decode the image, especially that they were photographic and not smooth-type-graphics.

Thanks for the suggestions.

0

Answer 4

KMT OP

Aug ’18

Ah, yes, photos oft provide better FeelsPerSecond as jpegs.

Thanks for the update, good luck w/your app(s).

0