One of Progressive Web Apps’ most vital features is that they are adaptive, which means that they always give the best experience possible regarding the screen size and capabilities of the browser. Yet, knowing each browser’s capabilities and compatibility with Progressive Web App (PWA) features is still beneficial. The following is a list the most popular PWA-supported browsers and their compatibility. It’s all summarized in the table below. Choose a browser that appeals to you and examine its compatibility with various functions, considering the screen type and operating system.
PWA Supported Browsers
The leading web browser providers have added feature improvements in later versions to support PWAs, owing to the recent popularity of these applications. The browsers and versions listed below are compatible.
- Desktop browser (Full Support): Chrome, Firefox, Opera, Edge, Safari
- Desktop browser (Partial Support/Outdated Version): QQ Browser, Baidu Browser
- Mobile browser (Full Support): Chrome, Firefox, Safari, UC Browser, Samsung Internet, Mint Browser, Wechat
- Mobile browser (Partial Support/Outdated Version): QQ Browser, Android Browser, Opera Mobile
|PWA Browser Support||Overview|
|Chrome||Chrome may be the most popular browser (except on Apple devices), but it isn’t the best in every way or with the most features. There are features that aren’t available on Chrome, but other browsers like Firefox, Opera, or Safari have them instead. That isn’t to suggest that Chrome isn’t a good program, but you should know that there are better options.|
For mobile devices: In Chrome, a button appears in the address bar for sites that support PWAs, much like in Edge.
For desktop devices: In Chrome, you’ll see an Install app option in the main Chrome menu for sites that fully support PWA capability. The app icon appears on your home screen after you select that option. (Note that for areas that don’t have PWA features, you can choose to Add to Home Screen.) The long-press options still include Uninstall, but underneath that is Site Settings, which isn’t available for store-installed apps.
|Firefox||Firefox, an open-source project, has pioneered several web capabilities, and the company behind it has been a vocal supporter of online privacy. It’s also famous for a large number of extensions available.|
Although Firefox supports several PWA APIs, it can’t install them as a stand-alone system app with an app-like experience.
The Android version of Firefox supports PWA, whereas the desktop version doesn’t. On the other hand, Mozilla attempted to provide support through a Site-Specific Browser.
In Android devices: In Firefox, a simple Install option is available for PWA sites. The Add to Screen dialog box appears once you tap this option. A little orange Firefox emblem appears at the bottom right of the primary app logo on the home screen icons for Firefox-created PWAs. For a more real-app experience, unlike those produced in Chrome, you won’t see the Site Settings option.
|Safari||For desktop devices: Installing PWAs on macOS is the same as on Windows, except the default Safari doesn’t have a way to make a site a PWA. In Launchpad, your new program is visible but not in the Applications Finder folder.|
For mobile devices: In iOS and iPadOS, Apple only permits Safari to generate PWAs; third-party browsers are excluded. Unlike other browsers that enable PWAs, Safari doesn’t utilize the terms install and app. To add one to your iOS or iPad’s home screen, go to a PWA-capable site, tap the Share up-arrow at the bottom of the page, and select Add to Home Screen. You can do this with any website, but you won’t get the offline capabilities that a genuine PWA provides.
|Edge||Installing PWAs on Microsoft’s desktop operating system is most accessible with Edge, the default Windows web browser. |
That’s because it adds the app to your Start menu the same way as any other app you’ve installed the traditional method (either with a downloaded program installer or from the Microsoft Store app).
|Opera||Opera was released in 1995, making it one of the oldest web browsers. Opera’s dedicated user base grew due to its ability to integrate a wide range of capabilities that would otherwise be limited to extensions and independent apps.|
Opera 32 for Android is now available with PWA – Add to Home Screen compatibility. You’ll discover several features that are specifically meant to bridge the gap between native apps and the “mobile web” alongside a slew of bug fixes, stability enhancements, and an updated Chromium engine for optimal compatibility and security (or, at least, the web viewed on mobile devices).
|QQ Browser||Tencent Explorer was the name of QQ Browser when it was initially released in 2000. The fact that it uses two engines, WebKit and Trident, distinguishes this browser. |
It used to support PWA in the past, but not so for the new version.
|Baidu Browser||Baidu Browser is a free web browser for Windows and Android that can send personal user data to Baidu servers without encryption or easily decryptable encryption. |
It is also the lightest browser on resources for low-end Android devices and is vulnerable to arbitrary code execution during software updates via man-in-the-middle attacks.
|UC Browser||UC Browser is a cross-platform web browser designed mainly for mobile devices. It’s noted for its minimal app size and data compression technologies, which has made it popular in emerging markets where users have phones with less device memory and slower internet speed.|
Cloud acceleration, multi-file format downloading, HTML5 web app and cloud synchronization features, and “rapid download,” a feature that downloads files in many portions at once, are among the browser’s other features.
|Samsung internet||This is the default and pre-installed browser on every Samsung mobile. It’s based on the Chromium project, which runs Chrome and Microsoft Edge.|
Samsung smartphones offer an alternative to the standard Android experience. If you visit a PWA site, your browser will display a badge. If you use Google Sheets or any other Web App frequently, the Browser will provide you with the most outstanding web app experience.
|Mint Browser||One of the most significant web browsers for Android phones is Mint Browser. You get breakneck speed, privacy, and security in a single compact box. When you value user experience over high-end technology, the 10-MB app is a lifesaver.|
Mint Browser has several security mechanisms to ensure safe browsing and provide all users with world-class security services and goods. To further reinforce the control users have over sharing their data with Xiaomi, the current upgrade offers an option for all users to switch on/off aggregated data collecting in incognito mode.
|With a monthly user base of over 1 billion people, WeChat is China’s most popular messaging program. While it began as a chat service, it has evolved into an app that allows you to make payments, hail a cab, and even book flights. |
However, you’re unlikely to have used it if you don’t reside in China.
PWA Unsupported Browsers
There are also specific browsers that do not actively support the custom elements required for Angular 6 or PWAs.
- Microsoft Edge is currently forcing PWAs to be available in their app store to be supported on this browser.
- On desktop, Safari and Firefox don’t support PWA installation. They support offline capabilities, but the experience will always start within the browser user interface. It may get full screen, but never a standalone window on a desktop.
Core PWA Features To Support Users’ Experience
- Background synchronization
This function refreshes data from the website regularly. The users will always have access to the most up-to-date information.
- Web Push notification
The ability of service workers to perform in the background allows for this capability. Users can access the website by tapping the reminder on their home screen.
- Offline mode
Once installed in the browser, offline accessibility handles the caching of app files, intercepts network requests, and then takes appropriate action based on whether or not the network is available.
This feature allows the app to be accessed without a connection and provides a better user experience. Even when an internet connection is available, specific files won’t need to be loaded from the web server because they’ll already be saved locally.
- Add to the home screen
This PWA feature makes it possible to install the website on mobile devices. It generates a shortcut on the screen so that users may reach the site fast by simply touching the icon badge instead of typing the link again. This feature is accessible in all browsers.
- Home screen/Splash screen
Another unique part of PWAs is that, despite running in a browser, they may be put directly on the user’s home screen and provide an immersive, full-screen experience.
Except for iOS, all browsers enable this capability, which helps reduce anxiety while waiting for a website to load.
The Geolocation API can be used to access information about the app user’s geolocation, allowing his location to be found (with the user’s consent). It also lets you keep an eye on the user and receive notifications when their position changes.
- Video & Image capturing
Today, the “Media Capture API” gives Web Apps direct access to audio and video inputs from devices (the camera and microphone). The Web App allows you to read and manage these feeds. As a result, you can, for example, capture a picture or record a video without leaving the browser.
Almost every browser system in the world supports PWA in some way. While PWA on iOS isn’t fully supported, the browser is starting to break down obstacles and allow some PWA capabilities to run on Apple devices.
This could hint that browsers worldwide are considering PWAs as having the same potential as native applications and are beginning to provide more incredible support to improve users’ experiences.
If you are about to set up a PWA site for your company and are looking for a legit PWA web development agency, then Tigren is your best choice.
We have built successful PWA projects that fulfill the needs of many businesses. Our team strives to deliver the best results for clients. For more info, drop us a message at [email protected].