HOT Tasking Manager - Service Worker
Published: 2022-12-07 10:49:18


Hello Dev community,

This is the first blog posting on this platform and I wanted to share a bit about a problem we have faced with one of our key tools-[ HOT Tasking Manager](https://tasks.hotosm.org/)- and how we addressed it! The HOT Tasking Manager ([Github repo](https://github.com/hotosm/tasking-manager)) is being maintained as a collective effort between the Humanitarian OpenStreetMap Team and Kathmandu Living Labs team.

**We would love to hear from the dev community and see if you have faced similar issues with the service worker and how you have resolved it.**

The Tasking Manager’s resource is covered by the service worker’s scope, acting as a network proxy. You'll discover that you can browse content while not connected to the internet; test browsing the "learn" page without an internet connection to check if the content is still accessible. The service provider makes this feasible. By enabling offline access and enhancing page performance with a number of caching techniques, they seek to increase reliability.

## The problem
The service worker currently installed on your browser has to be replaced whenever a new Tasking Manager deployment is done. We experienced problems with the latest service worker being unable to control the app for eerie, mysterious reasons. In layperson's terms, the user is not being able to access the new TM version, resulting in unexpected user behaviours.

When the browser notices a difference between the service worker currently in charge of the client and the new (from your server) version of the same file, it initiates the installation of the new service worker. The detecting procedure is carried out throughout a page visit. The most recent deployment's detection, download, and installation occur as the user browses the cached copy or the old service worker files. In other words, the most recent deployment will never be effectively downloaded and cached if the user does not spend enough time on the cached version of the app. Before returning, all tabs and windows must be closed or navigated away using the current service worker. The following service worker won't assume charge until after that.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o0m3rxdqfw3d7imm32t0.JPG)

It will take some time until the most recent deployment is cached or the new service worker is correctly installed if the app's size is too large for the network.

## Why show the ‘Update now’ prompt?
Refreshing the app to let the new service worker take over the client without giving the user a clear indication may be surprising and may not be what we want users to experience. To be on the safe side, we provide a prompt to the user to apply the update by showing the UI pop over notification, which is visible on the Tasking Manager's bottom left corner and notifies about the new version of the service worker that is pending and ready to be activated.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g56wstbobsix9o0awj6c.JPG)
The newly created service worker, awaiting activation, assumes control of the client if users click the "Update now" button. This indicates that the app is updated and supplied to the user. The new service worker will take over on the app's subsequent use if the user clicks the "Remind me later" button or simply dismisses this pop up. The pop up is a trade-off between providing the user with the actual version of the program and providing updates on their next visit. The compromise in this situation is that people continue to load the outdated cached TM. Without this pop up, we would fail to provide an opportunity to reload a page on a service worker update, which may bring about unexpected behaviours.

## Why are TM users suggested performing a hard refresh so frequently?
A hard refresh clears the browser's cache for a specific page, forcing it to load the most recent version of a page.

## Give me my latest version of TM already!
We could have had an evergreen Tasking Manager by removing the service worker and accessing all the assets on it directly from the network, but this would have resulted in a poor user experience because the network would have to fetch all the time-consuming resources. For the Tasking Manager, this is a necessary evil, offers incredible utility, and is advocated for progressive web applications.

If you are unable to log in or are experiencing additional issues, try hard-refreshing the browser. If it doesn't work, delete all site data from your browser.

We would love to hear your views!
Petya, HOT_tech and KLL team :)