能否创建无框桌面PWA?相关技术实现与讨论问询
Great question—this is a common pain point for developers wanting desktop PWAs to feel truly native, matching the frameless window experience of Electron or nw.js. Let’s break down the current state, discussions, barriers, and progress:
manifest.json Right now, standard Web App Manifest properties (like display: standalone or display: minimal-ui) only let you launch the PWA in a separate window stripped of browser UI (menus, bookmarks, etc.), but they cannot remove the native window frame—including the title bar (with app icon, name, and window controls) and the thin outer border of the window. Your initial research is correct: there’s no manifest field or standard web API that enables true frameless windows for desktop PWAs today.
This feature has been widely requested by the PWA developer community for years. Key conversations are happening in:
- Chromium’s issue tracker: Developers have pushed for a "frameless window" flag or API for desktop PWAs, arguing that it’s critical for parity with native apps. Many discussions tie into requests for more window customization control overall.
- W3C’s Web Applications Working Group: The group has explored how to expose window frame controls to web developers without compromising security or platform consistency.
There are three main hurdles holding back native frameless support:
- Security Risks: Allowing web content to hide the entire window frame could enable malicious sites to mimic system dialogs or native apps, tricking users into entering sensitive information. Browsers need to balance customization with user safety.
- Platform Consistency: Window controls (minimize/maximize/close) and window behavior (dragging, resizing) work differently across Windows, macOS, and Linux. Creating a cross-platform API that feels native on each OS is complex and requires coordination with OS vendors.
- Browser Prioritization: Browser teams have focused first on foundational PWA features (offline support, push notifications, installability criteria). Frameless windows are seen as an advanced, niche feature compared to these core capabilities.
While true frameless windows aren’t natively supported yet, there are ways to get closer to that experience, plus active development on standard solutions:
- Experimental CSS
window-controls-overlay: Browsers like Chrome and Edge offer an experimental flag (#enable-desktop-pwa-custom-window-frame) that lets you use thewindow-controls-overlayCSS feature. This lets your PWA’s content extend into the title bar area, and you can hide the default window controls to implement your own. It’s not fully frameless (the window border still exists), but it lets you create a more seamless, native-like UI. - Standardization of
Window Controls Overlay: This feature is now in the W3C’s Candidate Recommendation stage, meaning it’s on track to become a web standard. Once finalized, it will give developers consistent control over the title bar area across browsers and platforms. - Alternative Tooling: If you need full frameless support today, you’ll have to use wrapper tools like Electron, nw.js, or Tauri. These tools package your web app into a native executable, giving you full control over window framing—but they’re not pure PWAs, as they require separate packaging and distribution.
For now, you can’t remove the entire window frame using just manifest.json or standard web APIs. However, experimental features like window-controls-overlay let you customize the title bar to feel more native, and standardization efforts are underway to bring better window control to PWAs. The main barriers are security concerns and platform consistency challenges, which browser teams are working to address.
内容的提问来源于stack exchange,提问作者Ken Bellows




