Sometimes, you want to make sure you show a UI element to let the user know a new version of the front-app of your application is available. Prompting the user to reload the page to get the new front-end bundle is important, as your app's back-end might have changed to something that isn't compatible with an old version of the front-end. Detecting changes To detect an update, the usual pattern is to do a HTTP fetch every 30 seconds or so, and see if something has changed. There's a few ways to do this: Compare file contents My app is built using Vite, which will automatically create a new unique name of the JS bundle served for each build: <script type="module" crossorigin src="/assets/index-DOay74m5.js"></script> <link rel="stylesheet" crossorigin href="/assets/index-gBd2_900.css"> So a script could fetch this index.html and compare the paths agains the last version: const fetchVersionFingerprint = async (): Promise<string | null> => { const res = await…
No comments yet. Log in to reply on the Fediverse. Comments will appear here.