How does whatsappweb deliver updates?

Viewed 99

I'm wondering how does whatsappweb deliver updates? Do you ever notice a left green card appearing sometimes and asking you to click in a link to refresh page and run the new whatsappweb fresh code updated.

I'm almost sure they use webpack, service workers etc.

Chances are that you already had cache problems using webpack where even refreshing page it remains cached. So how does whatsappweb solved this issue with a single refresh link?

2 Answers

They use a service worker, if the service worker gets updated, they trigger something in the react app, is easy to do it.

  serviceWorker.register({ onUpdate: () => {console.log('new service worker')}});

just dispatch something instead of the console.log

Webpack is a building tool and isn't involved anywhere on a live site. While it offers Hot Module Reload for the development server you will not get it on the production version.

Unlike traditional desktop applications, delivering updates for websites is as straightforward as updating the files on your server (and invalidating any browser caches). You don't need to notify the user to download something, a simple refresh will get the new pages.

If you really want instantaneous updates (without waiting for the user to refresh the page) you can create some sort of WebSocket communication which when a message is received triggers a browser refresh. Nothing special and no deployment mechanisms involved.

Related