CSS Cache Problem - Question | JoomShaper

CSS Cache Problem

Vasiliy Gorodeckiy

Vasiliy Gorodeckiy

SP Page Builder 2 months ago

Hello again. There is a serious problem with the new version of the component.

The fact is that the CSS on the client is practically not updated. That is, I made a website, I access it through a browser - the old version. And this happens all the time.

You can press Ctrl+F5, I understand, but how can I explain this to clients? How to press Ctrl+F5 in the mobile version of the site?

In general, this is extremely inconvenient, but there is a solution.

In such cases, people on the Internet advised to make versioning for CSS files. I noticed that each page has its own page-[num].css.

I think that the option of creating your own version of the CSS after each edition (like page-42.css?1045) would solve the problem.

1
10 Answers
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 2 months ago #150746

Hi there!

Thanks for reaching out and for sharing your experience with us.

Where did you putting the custom CSS before? The custom CSS field of your Template Options or in custom.css file?

Yes, Each page has page CSS field there: https://share.cleanshot.com/hPcx57vr

May I have a screencast video of the whole scenario of the issue you are talking about to understand it better?

Best Regards

-1
Vasiliy Gorodeckiy
Vasiliy Gorodeckiy
Accepted Answer
1 month ago #151147

Why do you want to help me so much? I don't want help, I want the component to be improved. Let me explain again. The problem is caching of the site by all browsers.

It's very easy to check:

  1. Create a website with some blocks
  2. Save
  3. Load the page in the browser (mobile or PC version does not matter)
  4. Launch the editor and again change some CSS blocks: color, size, background - it doesn’t matter either
  5. Launch the page in the browser again - see that the text appears, but the CSS REMAINS OLD. All layout has bent.

I offered a solution. Make versioning of the CSS. How this is done in large projects like tilde - all this has already been invented and implemented.

See for example:

Here's before the page change

tilda-blocks-page45168379.min.css?t=1710149284

tilda-blocks-page45168379.min.js?t=1710149284

Here's after changing the page:

tilda-blocks-page45168379.min.css?t=1710149365

tilda-blocks-page45168379.min.js?t=1710149365

Do you see the difference?

The CSS and Javascript files are the same, but the versions are different. No cache reset is required. It is always fresh if there are changes on the page.

When will this be implemented? Where can I write to get this implemented faster?

0
Vasiliy Gorodeckiy
Vasiliy Gorodeckiy
Accepted Answer
1 month ago #151418

Please answer something. This is very important for my site. Without this, people often see poor page quality

https://www.joomshaper.com/forum/question/31579#qa-answer-151147

0
Vasiliy Gorodeckiy
Vasiliy Gorodeckiy
Accepted Answer
1 month ago #151420

Have you read the message from the forum? What do I need to do to get this done faster?

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 1 month ago #151423

Hi Vasiliy,

For time of Page edition in SPPB settings DISABLE Production Mode >> https://www.joomshaper.com/documentation/sp-page-builder/settings#advanced

This cause CSS cache, if you don't have an additional extension like JCH Optimize installed.

But on the forum we cannot change component code.


From RegularLabs there is also Cache Cleaner extension, it helps to clear cache in general.

0
Vasiliy Gorodeckiy
Vasiliy Gorodeckiy
Accepted Answer
1 month ago #151428

Paul, you don't want understand me...

  1. Production mode - ENABLED
  2. JCH Optimize - DISABLED

The problem is client side caching. It is there that the entire CSS cache is saved, which I cannot reset at all. IT'S NOT MINE, IT'S THE USER'S

See how it works ON TILDA

>> youtube.com/watch?v=TX0zWeaVVds

Any change is saved immediately and visible. No need to reset the cache of your browser, application, or phone. No Ctrl+F5 or Android resets.

Everything works, everything changes immediately after the save button.

See how it NOT WORKS on SPB

>>youtube.com/watch?v=CkaiMb4pXVM

In general, no change is visible until you press Ctrl+F5. That is, if a client visits the page once, HE WILL ALWAYS SEE THE OLD VERSION. There is no way to explain to him that he needs to reset the cache.

Guys, this is on your test site. Not on mine with all sorts of components, did you notice?

Is it clear why I want versioning of CSS and Javascript files?

I understand that you have a button to avoid this, but why do you need it? In fact, it is not needed if there is versioning. The site is always changing and it will be strange if I stop changing and improving it

0
Vasiliy Gorodeckiy
Vasiliy Gorodeckiy
Accepted Answer
1 month ago #151605

My reply in this post: https://www.joomshaper.com/forum/question/31579#qa-answer-151428

I have a feeling that when I just reply to a topic, you don’t see the message. And if I'm directly press “Reply”, then you notice. Is it so?

0
Vasiliy Gorodeckiy
Vasiliy Gorodeckiy
Accepted Answer
1 month ago #151615

Do you know what other option is there? Maybe somewhere in a more convenient place to place the “production mode” button? As a crutch for a component that does not yet want to introduce CSS versions))

Because site changes are constant. If the site and the project are developing, you cannot stop the production of pages. Some edits are required every day.

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 1 month ago #151619

If you are doing daily changes or you have to remember about Production mode > Clear cache, after caches

OR Disable that BEFORE changes.

There is NO magic pill for that.

I am afraid I cannot change component code on the forum.

0
Vasiliy Gorodeckiy
Vasiliy Gorodeckiy
Accepted Answer
1 month ago #151627

There is NO magic pill for that.

Why? Just the versions helped Tilda not to make a “Production” button at all. Everything works without it.

And what does this have to do with the changes on the forum? You just write to me “Everything is clear. We agree. The function will be implemented in the next patches.”

I don’t demand to do this right now, I just want them to understand me and take my requests into developing.

0