Understanding Image Transformations report

pludlow

My team has inherited internal processes that utilize Cloudinary from a time when we lacked sufficient guidance and standards for the platform. As we research older code and gain a clearer understanding of our existing implementation, I'm trying to identify the sources of the prevalent transformations, and why they are being used.

In Programmable Media UI, under "Reports/Delivery Reports" there is a section for "Top Image Transformations." When I examine these transformations, I've noticed that some of them appear to not make much sense. Any insight into how these are presented would be appreciated.

Here is an example of a report for one of our product environments.

• It seems that for #1 and #2 we are doing basic format transformations (which doesn't seem to be best practice for optimization); does setting a format imply a q_auto as well?
• #3 is really strange to me as it seems we are using f_auto but also setting the format to webp at the end of the chain. Is that correct, or is the declaration of webp just stating that that was the format determined to be best by the auto fetch format?
• #3 is also strange because it has flags for progressive and sanitize. Since sanitize is only used for SVG it doesn't seem relevant, and progressive is only used for PNG and JPG so that seems unneeded as well. It seems like the proper transformation for this entry should be f_auto,q_auto without anything else? Maybe those flags are present in case one of those applicable formats are uploaded? (Can flags be stringed together using a period, for some reason I thought it would need to be fl_progressive,fl_sanitize ?)

I know we have some improper practices currently, but would like to identify my misunderstands first before addressing improvements.

Thanks.

Zachary

Hey there,

Thanks so much for reaching out.

When not applying any transformation, Cloudinary delivers the image as is (unoptimized). If you apply any transformation to your images (e.g. width, height, etc), Cloudinary automatically optimizes the image by the industry's best practices, including metadata stripping and more.

In regards to #1 and #2 these both have transformations applied to them so they are optimized by default standards. This does not include q_auto by default but you can ask use to apply universal q_auto to all assets in your account.

Speaking to #3 you are specifying a format that is not needed in this case as f_auto will take care of the issue for you. As far as the flags applied, I can't think of a use case for fl_sanitize based on your description. fl_progressive is now supported for PNGs, JPGs, and single-frame GIFs as well. Lastly you can string together flags with a period but separating them out is recommended as it can help readability.

We have lots of great resources on how to optimize your assets:

Here's a quick video that will get you started - 

(https://res.cloudinary.com/orlyborly/video/upload/Training/optimizations3.mp4)

For more detailed information, please see - 

http://support.cloudinary.com/hc/en-us/articles/202521522-How-can-I-make-my-images-load-faster-

http://cloudinary.com/documentation/image_optimization

I would also recommend opening a support ticket so that we can look at your account personally and give you advice after you've implemented the changes listed in the resources above. You can email us at Support@cloudinary.com.

I hope this helps!