Hi, I’ve created a personal consumer product (I use Replit mainly for internal tools) and one feature I haven’t been able to nut out;
I’ve got a working PWA, however, trying to create a static app shell so when users open the app they see a static background / logo. But even though I’ve got an app shell enabled, I still get a white screen before the animated launch. Here it is; https://budget-flow-simon450.replit.app.
I haven’t dived deep into the code, side project! Wondered if anyone had any tips, I’ve got it on a dedicated Replit server, just to test it out. If you’re on iOS don’t even talk about the top inset on launch 
, it was working but keep breaking it.
1 Like
App splash screens are a nightmare, for PWA and native. iOS and Android treat them differently, and I recall Android changed the way they handle splashscreens in a later version.
In my AI Dev Kit (ADK) I spent a lot of time fixing this up, mainly for native apps. A lot of code tweaks were done by agent on the high power mode - I recall spending about $300 just on these issues.
My ADK also has a script that takes 6 master images for icons and splash screens, and generates 124 different variants of those images (yes 124!!) to suit apple and android devices, ready for the native app build process.
And I freely admit, something is still not right with the PWA version of the apps produced from the ADK. I am waiting for a rainy day to dive back in and figure it.
Oh, and yes, managing Android/iPhone device safe areas and iPhone notch areas is equally a nightmare across all devices and screen sizes. I’ve got something working in the ADK, but I am sure someone with a particular phone model (probably an older one) is going to find it doesn’t quite look right on their particular screen.
So, vibe coding PWA/native apps for mobile devices - I completely feel your pain!