Best smart image optimization tool? We tested four services head-to-head

Images are the backbone of every website but are often the culprit behind sluggish load times and poor performance. Optimizing images for your website is essential for enhancing web performance and user experience, but with so many services available, how do you pick the best one? We’ve got you covered.

Images significantly contribute to the overall size of web pages, often accounting for a substantial portion of the total page weight. According to the HTTP Archive’s Reports, the median transfer size for images on desktop pages is approximately 1,058.2 KB, constituting about 40% of the total median page weight of 2,655.1 KB. With this in mind, optimizing your images can lead to faster load times, reduced bandwidth costs, and happier users.

Image size on desktop pages

In this article, we tested four different image optimization services — Uploadcare, Cloudinary, ImageKit, and Filestack and how they optimize images to serve your users. We analyzed their performance in key areas such as file size reduction, image quality compression, and ease of use.

How we carried out the tests

Image Selection and Preparation

To test the image optimization services, we gathered a dataset of 10 different sizes from Unsplash. These images comprised landscape, portrait, night shots, product images, and artworks.

We carried out these tests by optimizing the images via these four services using the settings we felt were close to accuracy across them all; we also removed any automatic format and quality selection to ensure that the images were optimized across all services.

For services that measure the image quality output on a scale of 1-100, we use the value of 80 and also convert images to the same format for each service (JPEG, WEBP, and AVIF).

Uploadcare uses a different value quality output of images compared to other more readable services, so we used the value of normal to apply to all images to save traffic without significant quality loss.

From the table, we can see that while all the different services optimizes images using different algorithms, they were all able to significantly reduce the filesize of the original image while serving various image formats. This is especially useful when you need to optimized images for faster page load times and better user experience.

Image Quality Metrics

Usually, when you optimize an image, it loses some quality in the process. Depending on your service, the image quality after optimization can vary.

If this is very obvious, it can affect the user experience on your website by providing a poor-quality image that looks blurry to your users. Ideally, you do not want to serve your users overly compressed images that look blurry — Do you?

For this reason, it is essential to maintain the quality of the images while reducing the file size. The reduction in file size should be one of many factors to consider when optimizing images; how much quality loss does the image lose when it is optimized?

To test out the image quality of the images after optimization, we used a tool called DSSIM. DSSIM is a tool that compares the (dis)similarity between the original and optimized images using an algorithm to approximate human perception and gives a score based on the difference between both images. The lower the DSSIM score, the closer the optimized image is to the original — meaning better quality.

Now, all the different services use a different codec in their algorithm to optimize images, which can affect the image quality after optimization. To level the playing field, we optimized the images to be the same size or very close to the same size across all the services to provide a more accurate result.

What were the results? The table below shows the DSSIM score for each service after optimization:

Overall, we evaluated each service using a dataset of real-world images and measured using the following metrics:

— Image conversion: All services could convert images to JPEG, WEBP, and AVIF format. However, Filestack does not support AVIF image conversion. — File Size Reduction: The reduction in file size of an image after conversion. — Image Quality: The perceptual quality comparison before and after optimization irrespective of the codec value. — Ease of Use: How effortless is it to transform images using the service’s API? How easy is their UI to use when integrating with your applications?

Combining all of this gave us a detailed analysis of how well these services optimize website images. Let’s dive right into the findings, shall we?

Which is the best image optimization service? 4 top solutions tested

Overall, from the results, while all the services performed well in reducing the file size and serving optimized images, Uploadcare came out on top with the best image optimization service, with a solid reduction in file size and maintaining a high image quality after optimization.

When we first compared file size reduction, it looked like Uploadcare wasn’t as it, but bear in mind that the quality value for output is quite different from the value Uploadcare uses. Then, moving on to compare the compression ratio of quality loss across all services using the same file size for each service, this is where Uploadcare shines.

With the ten images, Uploadcare consistently provided a solid closeness in quality of the image to the original image in seven images compared to all the other contenders.

Uploadcare also provides a well-designed File Uploader that you can easily integrate into your application when you need a file uploading process and optimize your images.

1. Uploadcare

Uploadcare

Uploadcare provides you with a full image service solution which involves providing you with the ability to transform, optimize and deliver fast images via its CDN service.

Uploadcare also provides a plug-and-play widget, File Uploader, for easily uploading files from your applications to its server and sending server-optimized files to your users.

Setting up Uploadcare

To set up Uploadcare for uploading files in your application, you can use the File Uploader widget and depending on the framework your project uses, you can follow any of the integration guides found in the documentation to.

Uploadcare support URL operations for optimizing images. To do this, each file is available via the Uploadcare CDN using the URL:

Where:

• https://ucarecdn.com/ is Uploadcare’s CDN,

• 2a607169-d301-4e09-a6f7-187ea9bd6d9b is the unique ID of the file, and

• -/resize/800×600/-/enhance/100 are the different transformations applied to the image.

In the image optimization tests, we applied two transformation values:

• Quality: -/quality/value determines the image’s output quality; we used the value of normal to apply to all images to save traffic without significant quality loss.

• Format: -/format/value. All images we optimized were converted to JPEG, WEBP and also AVIF formats.

An example of how the URL for each image looked like when the transformation was applied looked like this:

https://ucarecdn.com/2a607169-d301-4e09-a6f7-187ea9bd6d9b/-/format/jpg/-/quality/normal/

As the report shows, there was a significant reduction in file size for images optimized with Uploadcare.

All of this happened while still maintaining a very impressive image quality of the images, making it a strong contender for the best optimization tool for delivering quality images with reduced file size.

Combined with it’s File Uploader widget that is beautifully designed with a good UX in mind to easily upload files, making it a strong contender for the best optimization tool for delivering quality images with reduced file size.

2. Cloudinary

Cloudinary

Cloudinary is a digital asset management tool that offers image optimization services to improve the load time of your images on your website by transforming the images with URL parameters and its API.

It also provides a file-uploading widget for uploading files in your applications.

Image optimization with Cloudinary

Cloudinary optimizes images via URL and provides different transformations to apply to your images.

To optimize images with Cloudinary, you can use the URL transformation parameters to apply different transformations to your images. E.g:

https://res.cloudinary.com/trustjamin/image/upload/f_jpg,q_80/v1731276769/image-comparison/image-7.jpg

Where:

• f_jpg is the format of the image,
• q_80 is the quality of the image, and
• /v1731276769/image-comparison/image-7.jpg is the image path.

When Cloudinary is compared to the other contenders, It performed well in the test but not as well as Uploadcare.

While it provides a significant file size reduction, it also records the highest value in the DSSIM value of optimized images.

Cloudinary also has a widget for uploading files to your applications to upload photos, and you can also

3. Imagekit

Imagekit

Imagekit is another optimization service on the list that provides image optimization services supporting URL transformations. Although they do not provide a widget for uploading files, they also performed decently in the test.

Image optimization with Imagekit

When images are uploaded to Imagekit, you can find images in the Digital Asset Management section of your dashboard, and to view these images, they are available via the URL:

https://ik.imagekit.io/ibfrpyqbkis/tr:q-80,tr:f-jpg/image-1_VboyyJxzD.jpg?updatedAt=1731278374360

Where:

• https://ik.imagekit.io is Imagekit’s CDN,
• tr:q-80 is the transformation value of the quality output of the image,
• tr:f-jpg is the format of the image,
• trustjamin is the account name, and
• image-comparison/image-7.jpg is the image path.

Imagekit performed well in the test compared to the other contenders but not as good as Uploadcare and Filestack.

4. Filestack

Filestack

The last contender on this list is Filestack, a file-uploading service that provides image optimization services and conversion via its API. One downside to Filestack is that it does not support AVIF image conversion.

Filestack does provide a widget for uploading files to your applications. Although it works well, its UX and UI don’t emulate a modern design when integrated into your application.

Image optimization with Filestack

You can optimize images with Filestack by using the URL transformation parameters to apply different transformations to your images.

E.g:

https://cdn.filestackcontent.com/output=format:jpg,quality:80/ESMXK2KSvuW9ewbfsQHN

Where:

• quality:80 is the quality of the image,
• format=jpg is the format of the image, and
• ESMXK2KSvuW9ewbfsQHN is the unique ID of the file.

Another downside to Filestack is that it does not support AVIF image conversion, which is a downside to the service. For this reason, we decided to remove AVIF image conversion from the test to level the playing field for all contenders.

AVIF is a new image format that provides better image quality and smaller file sizes than other image formats like JPEG and WEBP. It is supported by Uploadcare, Cloudinary, and Imagekit but not by Filestack.

Uploadcare supports AVIF image conversion out of the box, and in most cases, when you use Uploadcare, it automatically serves your users AVIF images if their devices support it.

Conclusion

Based on the tests, Uploadcare consistently provided better image quality after optimization than the other services, with a low DSSIM score for each image optimized.

This is not to say the other services didn’t perform well in the test, but when it comes to how the human eye perceives images, using Uploadcare to optimize images on your website, you can be sure that the quality of the images will be maintained while still reducing the file size compared to the other services.

This also means that using Uploadcare to optimize images on your website will result in faster page load times and a better user experience for your users. It will also help improve your website metrics, such as Largest Contentful Paint or LCP.

The real winners, of course, are your users, who will enjoy faster page load times and better user experience when you use Uploadcare to optimize images on your website.