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 resizing is the simplest of resizing and produces good results.
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 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.
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.
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).
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.
Explains how to use the C programming interface for high-speed vector image processing.developer.apple.com
Since time immemorial, iOS developers have been perplexed by a singular question: "How do you resize an image?". It is…nshipster.com
All these 'flag' options '!', ' ', '^', '%', and '@' are just on/off switches for the "-resize " operator. Just the…www.imagemagick.org
For the Distort Operator selecting "-filter Point", will force the use ofInterpolated Point Sampling instead of a…www.imagemagick.org
Developed at Innovation Labs @ Y Media Labs