Image Transformation Performance Issue on My Website Using Cloudinary

kimkorton889

Hello Cloudinary community,

I hope you can help me troubleshoot a performance issue I'm facing on my capcut premium apk website. I've integrated Cloudinary for image management and transformation, and while the service has been great overall, I'm encountering a specific problem related to image transformation performance.

Situation:

I have a website where users can upload images, which are then processed and displayed using Cloudinary's transformation capabilities. However, I've noticed that the loading times for these transformed images have become increasingly slower as the number of users and images on my website has grown. This is negatively impacting the user experience and overall website performance.

Details:

1. I'm using the Cloudinary SDK to dynamically generate image URLs with transformation parameters, such as resizing, cropping, and applying effects.
2. The issue seems to be more prominent during peak traffic hours when there is a higher demand for image transformations.
3. I've tried experimenting with different transformation options, but the performance problem persists.
4. I've also checked my account's usage and resource limits, and it seems that I'm well within the allocated limits.
5. I've reviewed my implementation to ensure that I'm not making unnecessary transformation requests or overloading the system with concurrent requests.
6. My website is hosted on a reputable cloud hosting provider, and I haven't noticed performance issues with other aspects of the website.

What I've Tried So Far:

1. Clearing browser cache to rule out caching issues.
2. Monitoring the network requests using browser developer tools to identify potential bottlenecks.

I'm seeking advice and suggestions from the Cloudinary community on how to address this performance problem. Are there any best practices, optimization techniques, or additional configurations I should consider to improve the image transformation performance on my website?

Your assistance is greatly appreciated! 😀

Tamara

Hi there,

Thanks for contacting us and for your super detailed post! :)

May I please ask you to provide more details about the problem you're encountering? (you can open a new private ticket here with all the info if you don't want to expose it publicly).

For example, can you tell me:

* An example file that transformed more slowly than expected, with information about the user's connection latency to `api.cloudinary.com` and their network connection speed (if you don't have all the info, just the public id).

* Details of anything configured in the upload API call, upload preset, or your account settings which may slow down the response time (such as synchronous analysis of the uploaded image, eager transformations, etc)

If you're uploading and transforming many small files at once, the network latency, connection time (DNS, TLS, etc), and other 'fixed' operations like updating your account's database or storage can represent a relatively large percentage of the start-to-finish time for each upload. Similarly, very large files which are sent in separate chunks, may be slower than expected if the chunk size is relatively low, because each separate HTTP request will incur those 'fixed' costs.

If slowness is due to actions taking place on our side (like copying large files to your account's storage + backups, requested eager transformations or other similar options that you requested), you may be able to mitigate that by making the Upload API call asynchronous so that the processing of the file takes place in a background thread.

That's achieved by passing async: true on the upload call or upload preset, and in that case, your code receives a fast and temporary 'placeholder' response to the upload call, and the asset metadata or error details can be sent to your server-side code in a webhooks notification after the upload completes: https://cloudinary.com/documentation/notifications

Best regards,

Tamara