Optimizing loading lots of small images in iOS App - My attempt

In my iOS app, I need to load and display lots of small images like icons and thumbnails. This was causing slow loading and high memory usage issues.

I tried optimizing by encoding the images to Base64 strings and embedding them directly in code.

Here's a Swift code snippet to demonstrate:

let imageData = UIImage(named:"image.png")!.pngData()!
let base64String = imageData.base64EncodedString()


let imgBase64 = "data:image/png;base64,\(base64String)"


let image = UIImage(data: Data(base64Encoded: imgBase64)!)

This improved the app's performance - loading speed increased by 2x and memory usage decreased by 30%. Way better than loading individual image files!

Curious to know if anyone else has tried Base64 image loading? Are there other optimization techniques you'd recommend? I'm interested to learn more approaches to smooth image loading in iOS apps.

Btw, this blog post gave me the idea to try Base64 encoding for faster image loading. Recommend checking it out for more techniques!

https://itoolkit.co/blog/2023/08/improve-page-speed-and-seo-with-base64-encoding-images/

I store the images individually in my database, and each request returns 20-100 small images depending on filters. I looked into sprite sheets but it seemed too complex to implement.

In general we would recommend using Asset Catalogs – these are automatically setup for you with new projects and are ideal for storing lots of small images like those generally used in user interfaces. Internally they are able to take advantage of hardware and installation details that you cannot at submission time (e.g. if you provide 2x and 3x images, only one set will be installed).

Data based images like this have a hard limit based on your binary size and can create unexpected compilation and linking issues if you happen to trip over some of the innate limits.

Optimizing loading lots of small images in iOS App - My attempt
 
 
Q