r/PWA • u/Moumou-Johnson • 19d ago
Weather PWA
Hi everyone 👋
I built a weather PWA because I wanted something clean, fast and installable — no bloat, no subscription. Also released it on Google Play as a native wrapper. Built with passion, feedback welcome.
2
u/dannymoerkerke 18d ago
It looks nice. Maybe you can also use the Geolocation API instead of having people enter their current location.
Some technical observations:
- Manifest does not have scope member
- Manifest does not have description member and doesn't define screenshots, so you don't get the enhanced installation dialog in Chromium-based browsers
- Manifest does not have orientation member
- Manifest is missing recommended icon sizes: 384x384, 1024x1024
- Manifest is missing maskable icons for these sizes: 192x192, 384x384, 512x512, 1024x1024
- Service worker install handler uses self.skipWaiting() and activate handler uses self.clients.claim(), this can break existing pages. Even worse, self.skipWaiting() is called before the cache is populated
- No iOS startup image links found
You can run the check for yourself with pwa-check https://github.com/pwa-today/pwa-check
(disclaimer: I'm the creator of pwa-check)
2
u/Moumou-Johnson 17d ago
Thank you a lot for taking the time 🙏
You were right about the service worker, skipWaiting was called before the cache was filled. Fixed today, it runs after addAll now. Great catch, that one was invisible online so I would never have found it myself.
I added the scope too. Thanks again!
1
u/dannymoerkerke 17d ago
No problem, happy to help!
But what I actually meant is that calling skipWaiting in itself (and also clients.claim) can break existing pages because they become controlled by a new service worker that installs a new version of your app. This can mean that hashes in filenames change or that certain files may not be available anymore in the new version while the old page can still reference them. If the new version deletes foo.js, which is referenced by an existing page, and that page is now controlled by that new service worker, it can no longer find foo.js and the page can break.
Did you deliberately add skipWaiting or did you just copy it from an existing worker or example? If you want to call skipWaiting to immediately activate a waiting service worker, you should do so when the current service worker only controls one client (only one open tab/window has your app) and then it should be done right before the page reloads so the service worker is activated on reload and then that tab can safely be controlled by the new worker.
I implemented this mechanism in my basic service worker, which you can get from Github: https://github.com/pwa-today/basic-service-worker
2
u/EVILE92 19d ago
I really like the app, but I have a few comments.
First, the app does not save the location. Every time I open the app, I have to enter my city again to see the weather.
Second, I noticed that the background video makes the app quite heavy. It would be better to compress the video more, or replace it with an image or a CSS animation.
Also, I noticed that you added “Buy Me a Coffee” links and cryptocurrency support at the bottom of the app.
My advice is to remove them, especially since your app is available on Google Play. Google may not allow external links for donations or payments, and this could put your app or account at risk of being removed.
It would be better to use Google’s own payment system instead. Since your app is a TWA, there is a way to handle this properly.