Stale web pages showing up after changing pages architecture
Hi, I have a static website hosted on pages. it used to be written in raw HTML, but it's been recently switched to react using vite to bootstrap. the front page was succesfully updated. however some pages are still rendering the stale page. I have already invalidated cache and switched the server to dev mode. but it seems like it's still stuck. This is using a custom domain, however the default subdomain is rendering everything correctly.
31 Replies
Like a page which existed before on the old site, is now gone on the new, but still is being served?
not exactly. on the new site it still exists in a different format
but it's rendering the old page instead
Can you give a more specific example or a url showing the issue?
https://contactforms.app is the url
if you go to the landing page, it's the new site
but if you click on Features
it's showing the old design
weird, can you try to click on the privacy button on the bottom? it might be client side cache then? I swear I thought Ive cleared cache already
The privacy policy?
yeah
contactforms.app/privacy
HUH
it's not rendering that on my machine at all
I have an idea of what you may be hitting
Pages has Asset Retention
Asset retention We will insert assets into the cache on a per-data center basis. Assets have a time-to-live (TTL) of one week but can also disappear at any time. If you do a new deploy, the assets could exist in that data center up to one week.https://developers.cloudflare.com/pages/configuration/serving-pages/ If on the new version the features page is entirely missing, it'll serve the old one if it's still in cache
yeah likely. since react renders pages entirely differently
but that would require the new version's feature page to be missing/nothing there
yeah following the instruciton to purge cache didn't do it
yea you can't purge the asset retention cache
that's completely internal
but it's not your issue per say, for it to be the issue, your new version is linking to a page that doesn't exist/it doesn't think the features page exists at all.
I mean that's not entirely impossible since react requires everything to serve index.html and the react routing handles /privacy
since im using react-router here
so there is physically no /privacy.html anymore
yea it's an SPA now, I see.
even without seeing the old page/having cache though it's still broken though. I can see it's loading react and such. I assume it works fine locally?
that features 404 is normal. I haven't had time to build it yet haha
oh lol
that privacy though is not normal. the version I see is a old version that's got no header
I wonder if it's go to do with this project is brand new with no visitors so cached versions don't exist in the point of presence you use yet
so you get served the latest version
Right, asset retention cache is per cloudflare location/colo
but since Ive been using the online version my PoP is cached
Cloudflare has some ~300 PoPs and ~600 colos or so
I mean unless you just so happen to live near Im assuming the san jose or SF PoP that might be it
You can which PoP you hit, if you go to /cdn-cgi/trace, ex: https://contactforms.app/cdn-cgi/trace, and look for `colo=
I'm up in upstate NY hitting ORD
I'm hitting SJC
so yeah wildly different
but yeah that makes sense. ill wait some time and see if it resolves itself. Thanks for your help!
would be nice if cloudflare could support a invalidate button, but it being free so I can't be angry at them 🙂
sorry maybe I didn't explicitly state it, but while what you are seeing is weird from your PoV, I think it's entirely expected behavior.
The Pages Routing is open source as well (although spaghetti):
https://github.com/cloudflare/workers-sdk/blob/52e9c71d21cd03d8d2fe5bea778ad9303ab3f0e7/packages/pages-shared/asset-server/handler.ts#L578C1-L578C48
When a page is not found, it first checks asset preservation cache. This is a local, per-colo cache just like the normal non-tiered caching cache.
If it find something, it'll return it.
If not, it goes into generateNotFoundResponse which is where the SPA Behavior lives and returns index.html
yeah that makes sense
just not being able to do a CreateInvaliation like in AWS cloudfront is 😦
yea 😦 going from non-spa to spa is pretty much the only way this would be caused by still unfortunate, only way you could side step it is by making a new Pages Project.
The Asset Preservation cache is for a week, although that's only a max not a min.
Yeah I originally thought it’d be easy to just do non spa and god was I so wrong
I'll double to check to see if there's any way to clear it/maybe cf can do it, this is clearly breaking for you, hmm
The cache belongs to the pages.dev, not your custom domain, hence why you can't clear it. There's no magical clear button sadly.
You could sidestep it by copying your index.html -> features.html on build (you could just throw it right into the build command) and thus making it exist, or a new pages project, or waiting it out. It'll expire faster if you don't keep hitting it/assets are evicted from cache based on access frequency