Sharp vs Imagemin for Image Minification in Node.js

Image optimization is crucial in web development for improving website performance. Two popular Node.js packages for image compression are Sharp and Imagemin. In this post, we will compare these two libraries in terms of image size reduction and processing speed.

Why Image Compression Matters

Compressing images helps reduce the time taken to load a webpage by decreasing image sizes, which in turn improves SEO, user experience, and even conversion rates. The goal is to compress images as much as possible while retaining an acceptable quality.

Overview of Sharp and Imagemin

• Sharp is a high-performance image processing library based on the popular libvips. It supports a wide variety of image formats and offers both resizing and compression capabilities.
• Imagemin is an image compression library that acts as a wrapper for multiple plugins, like imagemin-mozjpeg for JPEG compression and imagemin-pngquant for PNG files. It is widely used for its ease of use and wide array of plugins that make it customizable.

Both libraries are capable of compressing PNG and JPEG images. In this comparison, we will use four different images ranging from 3MB to 24MB in size and compare the results from both libraries.

Test Setup

We compressed four images of varying sizes using both libraries, with quality settings kept constant at 85% for both.

The results include the compressed image size, the percentage reduction, and the time taken for each process.

Compression Results

Filename	Original Size	Output Size (Sharp)	Output Size (Imagemin)	Sharp % Reduction	Imagemin % Reduction	Time Taken (Sharp)	Time Taken (Imagemin)
image-3mb.jpg	3.49 MB	2.33 MB	2.41 MB	33.31%	30.92%	6.38s	9.31s
image-5mb.jpg	5.02 MB	1.69 MB	1.79 MB	66.41%	64.28%	5.44s	9.78s
image-19mb.png	18.93 MB	3.22 MB	3.68 MB	83.00%	80.55%	6.73s	16.68s
image-24mb.png	24.90 MB	5.36 MB	5.44 MB	78.48%	78.14%	8.04s	24.59s

Key Insights

1. Compression Efficiency

Both Sharp and Imagemin performed well in reducing image sizes. For smaller images (like the 3MB and 5MB JPEGs), Sharp slightly outperformed Imagemin in compression efficiency, achieving a higher percentage of size reduction (33.31% vs 30.92% for image-3mb.jpg and 66.41% vs 64.28% for image-5mb.jpg).

For larger PNG images (like the 19MB and 24MB files), the performance gap was more noticeable, with Sharp reducing file sizes by around 83% and Imagemin by approximately 80%.

Overall, Sharp had a slight edge in terms of compression efficiency, especially for larger PNG files.

2. Processing Time

One significant difference was the time taken to process the images. Sharp was consistently faster than Imagemin across all image sizes, with Imagemin taking up to three times longer for some larger images.

For instance, compressing the 19MB PNG file took 6.73 seconds with Sharp but 16.68 seconds with Imagemin. Similarly, compressing the largest 24MB PNG took 8.04 seconds with Sharp compared to 24.59 seconds with Imagemin.

3. Code Complexity

Both libraries are easy to set up. Here's a breakdown of the implementation:

• Sharp Implementation:

  sharp(input).png({ palette: true, effort: 10, quality: 85 }).toFile(output);

  The above code minifies a PNG file, with Sharp allowing you to customize various parameters like effort (how much CPU effort to spend) and palette (for palette-based PNG images).

• Imagemin Implementation:

  imagemin([input], {
    destination: path.dirname(outputPath),
    plugins: [
      imageminMozjpeg({ quality: 85 }),
      imageminPngquant({ quality: [0.7, 0.9] }),
    ],
  });

  Imagemin uses plugins like imagemin-mozjpeg and imagemin-pngquant, which makes it highly customizable but adds a slight overhead compared to Sharp.

Conclusion

• Sharp is the clear winner in terms of speed. It consistently compressed images faster than Imagemin, especially for larger files. Additionally, Sharp had a slight edge in compression efficiency for both JPEG and PNG formats.
• Imagemin is still a solid choice, especially if you need customization for various image formats through its plugins. However, its slower processing time makes it less suitable for real-time or large-scale image processing tasks.

In conclusion, if you prioritize speed and simplicity, Sharp is the better choice. If you need more flexibility in terms of plugins and format handling, Imagemin could be the right fit.

You can see the code used for this test in my repository. Feel free to clone it, make adjustments, and run it on your own images.

---