Issue with CSS cache

Support Themes & Styling
1

Hello everybody,

I have an issue that start to be annoying : it’s my second Grav site that I’m working on, and there is a big problem with the cache and the CSS rendering.
I’m using the template “Editorial” (for both projects).

The issue : I have changed the styling by modifying the custom.css file, but when I refresh the page, no change appear.
Even worse: if I’m doing ctrl+F5 to reload the page, the page appear in one design that match with some modifications made many days ago, then if I do an other ctrl+F5: an other design appears with other modifications made an other time, then if I one more time refresh the page: the most recent modifications could appear (or could not) but with some details changed from many days, etc.

To resume: my Grav sites are showing different css styles each time I reload their pages…

I have even tried to delete completely the main.css file to let only the custom.css one, but the problem stay the same…!

The problem has begun from the start of each Grav fresh installation. For both projects.
One project is on a Nginx CloudPanel virtual server with PHP 8.3, the other project on an Apache Virtualmin server with PHP 8.2.
Both project are proxied by CloudFlare.

For information: I have disable all the cache options for Grav (CSS cache, Twig cache, index cache, render cache, object cache) and I’m deleting the Grav cache from the Admin panel by clicking on “Clear Cache” on the Dashboard to be sure that no cache remains, I have deleted all the cache of my browser, the vanilla cache of my virtual server, and the cache of CloudFlare is disable and have been emptied.

I have got this issue on Opera, Chrome, Chromium, Firefox, and Edge browsers.
So, the problem is clearly coming from Grav.

I don’t understand where are cached all those CSS files… and why Grav is able to show different styling versions each time I reload the page… ?

Hope someone can help me on this…

2 Likes
2

Maybe I found the solution (I have still to investigate on this): it could be CloudFlare the problem. As I disable the proxy and purge totally the cache from CloudFlare, the file custom.css seems to be taken into consideration as it should be.

I had already done it, but it seems that CloudFlare enable the cache soon after we disable it, by itself. So, we could think the cache is disable when finally it is not… What create strange behavior on Grav site.

I’m going to wait some days to be sure that it is the solution, and to check this post as resolved.

1 Like
3

Thanks for the update and for describing your problem very well in the original post!

I use Cloudflare’s Turnstile now for form CAPTCHAs, but I have to say all I read about are issues with its hosting tools. I can see the attraction but I wonder if the benefits it is supposed to provide for developers are really worth it. And I wonder if the benefits it supposedly provides users are discernible by them. As a user, I am often frustrated browsing a Cloudflare-hosted page in Incognito mode. Something to consider. Mainly I just wanted to rant about that :slight_smile:

4

Yes, I agree that CloudFlare can sometimes create a bad experience for users, and even for those who manage websites… But there are also some advantages, like proxiing and being in SSL without any hassle.
But I agree that in general, I’m too wonder if CloudFlare is really worth it compared to the disadvantages that it creates…

1 Like
5

I can at last confirm that my problem was because of CloudFlare and its caching system.
It’s a bit anoying, because CloudFlare reactivate the cache automatically everyday, even if we disable it manually… So, if I’m working on a website, I have to disable everyday the CloudFalre cache before to do anything.

1 Like