add Vite PWA plugin

[incognitojam]

The service worker will check for updates on page load, downloading them in the background ready to present on the next page load.

• Test update
• Double check that you do not have caching features enabled, especially immutable, on locations like:
  • /
  • /sw.js
  • /index.html
  • /manifest.webmanifest

$ curl -s -I -X GET localhost:3000/index.html
HTTP/1.1 200 OK
Server: nginx/1.24.0
Date: Wed, 05 Jul 2023 15:09:06 GMT
Content-Type: text/html
Content-Length: 4612
Last-Modified: Wed, 05 Jul 2023 15:07:18 GMT
Connection: keep-alive
Vary: Accept-Encoding
Cache-Control: public, max-age=0, s-maxage=0, must-revalidate
Accept-Ranges: bytes

https://vite-pwa-org.netlify.app/deployment/nginx.html
Running production nginx server using docker compose, test command: curl -s -I -X GET localhost:3000/index.html

[github-actions]

Size Change: -164 kB (-29%) 🎉

Total Size: 399 kB

Filename	Size	Change
./dist/assets/explorer.js	351 kB	+12.4 kB (+4%)
./dist/assets/index.js	1.89 kB	-176 kB (-99%)	🏆
./dist/assets/SwitchLoading.js	21.2 kB	+447 B (+2%)

ℹ️ View Unchanged

Filename	Size	Change
./dist/assets/anonymous.js	5.1 kB	+1 B (0%)
./dist/assets/explorer.css	3.42 kB	0 B
./dist/assets/index.css	5.16 kB	-12 B (0%)
./dist/assets/NoDeviceUpsell.js	794 B	-2 B (0%)
./dist/assets/qr-scanner-worker.min.js	10.2 kB	0 B

_{compressed-size-action}

[incognitojam]

Service worker downloads update in the background... (since I reverted the last commit, those files were already in the disk cache!). New code is used on next page reload.

[incognitojam]

vite-pwa-plugin automatically generates the service worker code, including the list of resources to pre-fetch (the contents of the dist folder from the build)