CFimage vs PhotoShop – reduce image size in multiple passes

I’ve noticed in PhotoShop that it’s best to reduce images in multiple passes. For instance, to make a 100px thumbnail from a 1000px image requires 4 resize actions:

  1. 1000 : 50% = 500
  2. 500 : 50% = 250
  3. 250 : 50% = 125
  4. 125 : 100px = 100px

The smaller image is crisper. Then I wondered if the same would hold true for ColdFusion’s built in CFimage tag. Let’s check it out. In both cases I started with the same image (uncompressed TIF) and output to disk a JPG with quality set to 100%.

You can download the original uncompressed TIF here: grey.tif (12.8MB).

PhotoShop

Using the above steps (but more of them) I brought this 2112px image down to 200px. Interpolation is set to “Bicubic Sharper (best for reduction)”. The output is grey-stepped-ps.jpg (43KB). Then I did a single resize action to create grey-one-ps.jpg (65KB). I found it odd that the output sizes we off by 50%!

ColdFusion

Mimicking the PS work with CFimage is easy. Here I have Interpolation set to the default, “highestQuality’ and antialiasing turned on.

Here is the code I used for the multiple pass version of the resize:

<!--- READ THE TIF --->
<cfimage source="#expandPath('./')#grey.tif" name="myImage">
<cfset ImageSetAntialiasing(myImage,"on")>
<!--- TO 1056 --->
<cfset ImageResize(myImage, "50%", "50%")>
<!--- TO 528 --->
<cfset ImageResize(myImage, "50%", "50%")>
<!--- TO 264 --->
<cfset ImageResize(myImage, "50%", "50%")>
<!--- TO 200 --->
<cfset ImageResize(myImage, "200", "200")>
<!--- WRITE TO DISK --->
<cfimage source="#myImage#" action="write" destination="#expandPath('./')#grey-stepped-cf.jpg" overwrite="yes" quality="1">

The output is grey-stepped-cf.jpg, 43KB. The page took 9.3 seconds.

And here the single pass version:

<!--- READ THE TIF --->
<cfimage source="#expandPath('./')#grey.tif" name="myImage">
<cfset ImageSetAntialiasing(myImage,"on")>
<!--- TO 200 --->
<cfset ImageResize(myImage, "200", "200")>
<!--- WRITE TO DISK --->
<cfimage source="#myImage#" action="write" destination="#expandPath('./')#grey-one-cf.jpg" overwrite="yes" quality="1">

The output is grey-one-cf.jpg, also 43KB. The page took 4.8 seconds.

Outcome

Sure enough, the multiple pass method in PhotoShop yields a nicer image. However, it looks like a single pass resize with CFimage looks better.

5 Replies to “CFimage vs PhotoShop – reduce image size in multiple passes”

  1. @Oğuz Demirkapı
    I can’t complain. I think they all look good enough for production.
    Can you download that original Tif and run the same processes on it with efflare ImageFlare? It would be nice to see a comparison to external tools.

Comments are closed.