How to optimizing image serve in mobile apps

I’m using Cloudflare image to serve images on mobile apps, I call an api and it returns the image url ( , but it looks like there is image loading latency on the mobile app, how do I optimize this?
do I need to modify the url and define (for example,height=500) or is there a resolution? bearing in mind that phone sizes are also varied, including tablets? how do I specify in the url that it will be width=500 or not that will be displayed? The application is in Flutter.

Hi, If I get your question right, you can use the combination of flexible variants and dpr Flexible variants · Cloudflare Image Optimization docs

Yes, i can use this, so you mean the dpr value depends on the size of the phone or tablet ? but does this solve the image loading latency in the application ? .

Yes and no.

It depends on traffic patterns. Using less variants gives better cache hit ratio, but dpr itself does not speed up processing.

You can also define your own named variants for different phone/tables sizes, e.g.

In this case, what is the best practise if we have a cross plateform app( web, tablet, mobile apps), should we create a variant or using a flexible variant ?, as far as I know, the use of a variant is limited because you only specify the width and height, then the fit, the metadata and the blur, whereas the flexible variant has several parameters that can be set on the image url.

whatever is suitable for you, the same would apply to variety of flexible variants: the less image variants you have, the likely a client to hit the cache.

1 Like

Is there any way to see the images that have been distributed to users on Cloudflare?

No, we don’t have such analytics.

1 Like

This topic was automatically closed after 15 days. New replies are no longer allowed.