Force browser to load new content

I’ve recently updated my website with a complete overhaul of pages and content. When I checked my work by going on line and visiting the website my browser loaded the old version as it was still in cache. I got 404 messages for pages that were displayed on the menu but which no longer existed. I had to force a browser refresh to get the new content. Is there a way to code a page to check against the browser cache to see if it is the current version and if not force a reload from the server? For the time being I have coded my index page to always load from the server and placed a message advising vistors to refresh their browser cache but this has to be done for every page and I would like something more elegant. Bear in mind I am not very conversant with coding.
(Still using Blocs 2)

Thanks.

EDIT: ignore my suggestion, look below :wink:

You could try using the cache bust option in project settings. Cache busting tells browsers that there is a new version of the page available and forces a page load when the site is visited.

2 Likes

Thanks @hendon52, that sounds like a much better option. I had never looked into what Cache bursting was, thats good to know. Awesome.

@Malachiman When developing a website on the test domain I always leave the cache bust option enabled, not least to minimise issues with clients who are incapable of clearing a browser cache. On the final export to the client domain as the site goes live I switch it off.

2 Likes

Thanks mate, I usually end up exporting into OctoberCMS, so it was mute for me. Appreciate the info for future builds.

Thanks for the replies. I think the cache burst option must be Blocs 3 only. I’m still using Blocs 2. Perhaps time to upgrade!

Yes. Blocs 3 is definitely worth the upgrade.

But how does the “Cache Bust” checkbox in Project Setting work, exactly?

If we keep it check marked and preview within Blocs once, then untick it and Export, will our exported files be changed such that when we upload them to the server anyone who had viewed an older version of our website before would then get see the newest content?

Or must we checkmark “Cache Bust” and Export once, then go back to Blocs and untick it and Export a second time to get the files changed?

Obviously, leaving Cache Bust check marked and Exporting and uploading would work, I know that. But we don’t want to leave it check marked because it would then perpetually bust the caches, causing slow web page rendering.

So what I want to know is how it works and when.

The ultimate aim here is for me to ensure that whatever new Blocs-generated web files I upload to my web server do NOT have perpetual cache busting code, yet I want all my previous website visitors to get the newest content I just uploaded.

I think you are seeking perfection in an imperfect world where you are unable to control how your visitors use their browsers.

Leave cache bust on during development, then disable with the final export when the site goes live. That sort of achieves your aims just there. I generally find few problems like this unless combining something like CloudFlare with another cache plugin or technology that can then cause some very sticky problems.

For a performance boost on returning visitors try cache leveraging in the htaccess. Something like this:

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType video/mp4 "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 2 days"
</IfModule>
## EXPIRES CACHING ##
1 Like

But what is changed when using Cache Bust?

Again, when I checkmark that option and Preview in Blocs one time, it’s done its deed and I can then export knowing cache bust will do its job in-browser correct?

The reason I ask is because I still use Freeway, and there is an Action I use that will update my CSS files when I tell it to do so. I think it does some kind of versioning. I am wondering if Blocs cache bust does the same thing, and also I want to what what the trigger is. For example, if it does versioning, does Preview in Blocs trigger the version number change, or something else?

@JDW a quick google search of “cache burst” will reveal tons of articles explaining it.

Not to mention Blocs own docs.

https://help.blocsapp.com/knowledge-base/project-settings/#cache-bust-css-and-js

1 Like

So basically it uses versioning suffixes. OK. But when are those suffixes applied? After you checkmark that box? When you first Preview? When?

Well it’s an export setting.

I haven’t looked but I would imagine something like this is also applied when previewing in a browser from a blocs project too. A quick look at the HTML will tell you.