I deploy my React application to Firebase hosting and use Cloudflare CDN caching. Recently, I faced performance issues with the initial page loading as the bundle size grew huge. To fix this, I started using dynamic imports for route-based chunking.
The initial page loading improved significantly, but it lead to another issue.
After a deployment, old bundles are replaced with newer bundles in Firebase. It might be the case that some of the bundles were never fetched and therefore never cached in CDN. If there is a user who is active on an older version of the website, it might be expecting older bundles in the flow but it will fail to load.
I am not considering force reloading the website as it may lead to unexpected data loss.
One possible workaround could be to make cURL requests to all static resources/bundles right after the deployment to force caching on CDN.
What is the generally recommended practice people follow to make caching work with older assets post-deployment?
