Thumbnailing images benchmark

[quentin-bettoum]

Hello there,

Following this discussion, I've been trying to find the best way to thumbnail images using Vix/Image and benchmark it.

There are multiple ways to open and thumbnail an image.
The two most efficients are:

img_path |> Image.open!() |> Image.thumbnail!("1000x500") |> Image.write!(output_path)

img_path |> Image.thumbnail!("1000x500") |> Image.write!(output_path)

Image.thumbnail!(path) will open the image and thumbnail it directly and should automatically use some optimization to make it faster than Image.open! |> Image.thumbnail!, but since you can also manually set a shrink option on Image.open, I was wondering if it could be faster to compute the optimal shrink-on-load by retrieving the image width and height, and then open it with this optimal value (considering we don't want the shrinked image to be less than 2 times the wanted thumbnail size to avoid aliasing).

Here is a summary of what the results tells me.

1. Compute the optimal shrink/scale on load, and then Image.open! |> Image.thumbnail! is usually way waster than just Image.thumbnail(path). Up to 12 times faster on large jpeg inputs.
2. The only cases where this is not true are:
   • when the input does not support shrink-on-load such as TIFF
   • when the input is a WebP which I don't understand why. Either Vips is more optimized to thumbnail(path) for WebP, or the libwebp scale-on-load is slower than the JPEG shrink-on-load.

In these two cases, Image.thumbnail(path) seems to be around 10% faster.

The benchmark

Sources are available here

Results in HTML

Raw results

I also initially benchmarked with Mogrify and Image.resize, but since they were significantly slower and because I wanted to debloat the results, I removed them from the benchmark.

To see the efficiency of the functions used to compute the optimal shrink, I added a shrink CHEAT case where the optimal value is computed before the start of the benchmark.
This value is to be compared to the dynamic shrink where the value is computed while the benchmark is running.

---

If you want try the benchmark by yourself, you just have to put any image in the images folder, and the module will automatically try every option on each image for the benchmark.
I did not upload all the sample images I used for the benchmark because I wanted to avoid to overload the repository since some images are quite large.

I didn't have the time to comment the code, but I believe the most interesting part of it are these functions which are used to compute the optimal shrink (for JPG) or scale (for WebP):

defp get_optimal_shrink_or_scale(img, target_width: w, target_height: h) do
  case get_image_extension(img) do
    x when x in ["jpg", "jpeg"] ->
      img 
      |> compute_optimal_shrink(w, h)
      |> normalize_shrink_for_jpg()
      |> then(& [shrink: &1])
    "webp" -> img |> compute_optimal_scale(w, h) |> then(& [scale: &1])
    _ -> []
  end
end

defp compute_optimal_shrink(img, target_width, target_height) do
  width_maximum_shrink = img |> Image.width() |> Integer.floor_div(target_width * 2)
  height_maximum_shrink = img |> Image.height() |> Integer.floor_div(target_height * 2)

  case min(height_maximum_shrink, width_maximum_shrink) do
    x when x <= 1 -> 1
    x when x > 1 -> x
  end
end

defp compute_optimal_scale(img, target_width, target_height) do
  width_minimum_scale = img |> Image.width() |> Kernel./(target_width * 2) |> Float.pow(-1) |> Float.ceil(2)
  height_minimum_scale = img |> Image.height() |> Kernel./(target_height * 2) |> Float.pow(-1) |> Float.ceil(2)

  case max(width_minimum_scale, height_minimum_scale) do
    x when x >= 1 -> 1
    x when x < 1 -> x
  end
end

defp normalize_shrink_for_jpg(shrink) do
  case shrink do
    x when x === 1 -> x
    x when x in 2..3 -> 2
    x when x in 4..7 -> 4
    x when x in 8..15 -> 8
    x when x >= 16 -> 16
  end
end

defp get_image_extension(img) do
  img |> Vix.Vips.Image.filename() |> String.split(".") |> List.last() |> String.downcase()
end

Also keep in mind that the use case tested in the benchmark is outputing thumbnailed image in JPG, WebP, and AVIF since these formats are supported on the web. The results could be different on another use case.