Exclude User-Agent from Cache

I have a Wordpress/WooCommerce website and keep having major problems viewing the site on iPad or iPhone. I have tried everything I can think of to diagnose the issue and the only way I can make the site render correctly is to “Enable Developer Mode” which forces a Cache Bypass for 3 hours.
The site is https://www.catkarmacreations.com and when testing WPRocket plugin I was able to Exclude the following user-agents:

(.)Safari(.)
(.)iPad(.)
(.)iPhone(.)

I need to be able to do the same on Cloudflare or find another solution so site shows correctly on iDevices via Cloudflare, which I really like and improves my site performance stats.

Many thanks for any assistance.

Glyn

I’m going to guess that images aren’t showing up, and you have a plug-in that converts images to WebP. Is this correct?

That is correct, but I get the issues when serving webP and when that plugin is disabled and all webP images have been deleted and cache cleared.

The only time everything works on iDevices is when Cloudflare is set to Debug mode, so I am assuming it is a caching issue.

It’s come up many times. Short version: Don’t convert to WebP at the origin.

https://community.cloudflare.com/search?q=webp%20safari

So the problem is how Cloudflare delivers webp images to non webP browsers… Safari is such a browser but Chrome on iOS can show webP and suffers from the same random missing images when I use CloudFlare.

I think it is time to find a different solution than Cloudflare and suffer the performance hit.

Many thanks for your help

Glyn

No, the problem is that Cloudflare caches by filename. If the origin slips in a WebP image, but with a JPG extension, that’s what Cloudflare will send to browsers when the HTML requests a JPG filename. Paid plans include their own WebP conversion feature that does all the processing at the edge. But on Free plans, you’ll have to find another way to sub in WebP images. I’m not sure why plugins don’t store WebP images with a .webp extension, then modify the HTML code. I suspect it’s because it requires too much processing power.

I’ve not heard this. The opposite, in fact. This is because any browser on iOS is just a skinned version of Safari. So far.

1 Like

Could Very easily resolve my issue by allowing Exclude from cache based on User-Agent… as in my original request.
many thanks

Glyn

What you’re asking for sounds similar to an Enterprise feature. It’s easy to say “Cloudflare should do X for me for free.” While they can do just about anything imaginable, there needs to be a business justification for it.

I’m pretty sure a Worker could be crafted to do this, and only assign it to *.jpg matches. Workers can do just about anything people are requesting. It just takes some coding skill and a Workers Unlimited subscription.