When uploading an image to Cloudinary, it is stored as is in your account.
Here's an uploaded image with no transformations:
http://res.cloudinary.com/demo/image/upload/couple.jpg
The original file's size is ~200KB, therefore clicking its link (http://res.cloudinary.com/demo/image/upload/couple.jpg) will deliver the original ~200KB file as is.
However, some base optimizations are automatically performed by Cloudinary when even a single transformation is included.
For example, the following link delivers a ~40KB version of the same image, even when setting the dimensions of the image to the exact same as before with w_1.0:
http://res.cloudinary.com/demo/image/upload/w_1.0/couple.jpg
If you'd like to optimize an image upon uploading it to your account, you can apply any incoming transformation so that the optimized version is saved as the original version (e.g., using a_exif to automatically rotate the image according to its EXIF data). For more information about incoming transformations, you can refer to our documentation on performing transformations upon upload.
If you'd like to optimize your images further, you can refer to our documentation on image optimization, and in particular consider the use of f_auto and q_auto in your delivery URLs to automatically deliver the optimal format and quality level for your images.
Comments
4 comments
I did a test. The original image file is 1.7MB, however, after cloudinary transform it become 1.8MB. How come it become larger?
I noticed also the output image of cloudinary can be further optimized up to 70% by website like tinypng.
TinyPNG converts the PNGs to 'PNG8'. Cloudinary also supports 'PNG8' instead of the default 'PNG24' format.
This is done by setting the
flagsparameter topng8(fl_png8in URLs).The following produces a 363KB image:
http://res.cloudinary.com/demo/image/fetch/w_1.0,fl_png8/v1414663063/http://img1.wikia.nocookie.net/__cb20120718024112/fantendo/images/6/6e/Small-mario.png
How will we know the image is optimized after clicking the given url, it is still the same file size
Hi Joel,
The images can be optimized by using transformation parameters as described in this documentation. For example, the original image can be accessed through the following delivery URL:
https://res.cloudinary.com/demo/image/sample.jpg
Depending on the transformation you apply, the derived delivery URL will contain the transformation parameters. For example, the original image's dimension can be altered to 250x250px and the following transformed delivery URL should be referenced on your web page HTML <img> tag:
https://res.cloudinary.com/demo/image/upload/w_250,h_250/sample.jpg
Kindly see this link for some additional information.
Hope this helps.
Please sign in to leave a comment.