Resizing Techniques and Image Quality That Every iOS Developer Should Know

Images are an integral part of every application. Resizing images have been a recurrent problem for all developers. With camera resolution increasing and devices getting fragmented, it is crucial that the algorithm used to resizing provide accurate results.

In this article I’ll be empirically going over image resizing techniques and best possible solution to resizing images focusing on quality of image.

Techniques to resize

Here I am going to go over four methods to resize images. All focused on generating the best quality of image.

I am going to compare all resized images with a reference image. Lets generate the reference image from Photoshop(Bicubic). We’ll compare the images graphically and then emperically with Average Error.

UIKit

UIKit resizing is the simplest of resizing and produces good results.

CoreGraphics

Using CoreGraphics quality of the image is identical to the UIKit image. Atleast I could not perceive any difference and imagediff also gave no difference. Only difference is in the performance.

Let’s see the difference between the core graphics image and the original. If you look closely at the gif, you can notice that the image is blurry. We might need to sharpen this image a little or use another method to resize to generate better results.

CoreImage

CoreImage produces quite interesting results. This being the slowest of all the methods, I assumed to produce much better quality images but seems to be generating lot of resizing artifacts.

Here is a comparison of CoreImage resizing result with original image.

You can notice that the lights appear more brighter than it should be. This artifact occurs in all images resized with CoreImage. Image also seems slightly more sharper generally.

vImage

This poorly documented little framework packs a very strong punch. The results are astonishing. This produces the best results with perfectly crisp and balanced image. Less blurring compared to CG. Sharper than CG. Not as unnaturally sharp as CI.

Comparison of UIKit, CoreGraphics and vImage for Resizing Images

In the above comparison. If you look at the differences between the reference image(left most) you would notice that vImage resizing produces the best results with least amount of difference(red). Its not just this image, but most of the images resized with this code generate similar results.

The performance of the API is great. This can easily be used for all image resizing operations.

Note: I evaluated the color metrics, comparing it to original image and vImage seems to be the closest to the original sized image than other resized images including photoshop resized versions.

Downside of vImage

vImage resizing uses Lanczos5 resampling filter. Here is a quote from the official apple documentation

The Lanczos resampling method usually produces better-looking results than simpler approaches such as linear interpolation. However, the Lanczos method can produce ringing effects near regions of high frequency signals (such as line art).

Comparison

Lets compare all the algorithms and see the Average Error across images.

The average error seems to be quite low for vImage.

I rest my case!

Any requests or suggestions please hit comment.

Introduction to vImage Programming Guide

Image Resizing Techniques

Resizing or Scaling -- IM v6 Examples

Resampling Filters -- IM v6 Examples

https://github.com/ymedialabs/UIImageCategories.git

Developed at Innovation Labs @ Y Media Labs