Something that slightly bugs me about progressive web apps on the desktop is that they retain the browser chrome/frame when you "install" them/pin them to your desktop. I love that the menu bar, bookmarks, etc. are gone, since the point is to feel like a native app rather than something in my browser, but the frame feels like one last thing standing in the way of a truly native feel. For comparison, consider the "frameless window" concept from nw.js or Electron.
So is there any way, e.g. an option in the manifest.json
file, to hide the frame as well?
My research indicates that the answer is currently "no", so I guess a followup question would be, has there been any discussion of it? Are there concerns preventing it, or has it just not come up at all? Any info would be great.
Edit: To be clearer, I don't mean simply launching in a separate window with its own icon, that's just what desktop installed PWAs are. I mean removing/hiding the title bar as well, with the app icon and name and the minimize/maximize/close buttons, plus the thin frame border that runs around the outside of the entire window. All this stuff:
Such apps have limited access to software and hardware features. For instance, they do not support features that are not maintained by HTML5. Additionally, for iOS devices, PWA doesn't yet work with Face ID and Touch ID, Siri, ARKit, In-App payments, and Apple's other primary features.
Hybrid Apps are called hybrid because they are built with web technologies (HTML, CSS, and JavaScript) but allow access to platform features that a browser can't provide. Progressive Web Apps are essentially websites that load instantly on any connection, regardless of whether you're online or offline.
Today, Progressive Web Apps are accessible via smartphones and desktops across a variety of browsers (For iOS users, only Safari can be used to add a PWA to the home screen). PWAs also support many of the same features or functions that native apps support.
The first part of the term – Progressive – means that the user experience is enhanced gradually based on the browser's capabilities. Essentially this means that the web application works well in older browsers but can utilise newer technologies to enhance the experience if the user is using a browser supporting them.
What you're looking for is display
in the manifest (see https://developer.mozilla.org/en-US/docs/Web/Manifest#display).
"display": "fullscreen"
indicates you want to completely hide the browser chrome.
However, support of specific display modes varies between browsers and platforms.
For example Windows 10 (via Edge) only supports browser
and standalone
right now, with support for fullscreen
and minimal-ui
coming in Redstone 5.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With