safari pwa

PWA on iOS - Current Status & Limitations for Users [2024]

Apple couldn't stay behind anymore since PWAs are much more than a buzzword. What's the status now? Does iOS finally provide full support for PWAs? You'll find the answer below.

A QUICK SUMMARY – FOR THE BUSY ONES

TABLE OF CONTENTS

Introduction

Apple could care more about Progressive Web Apps, there’s no doubt about that. There’s not much documentation, the APIs are added slowly and most common things like Web App Manifest aren’t there for too long (at this point, I wonder if they will get there at all). On the other hand, PWAs are a thing . Maybe not as hyped as Machine Learning, but still, there’s a solid batch of those out there. And even Apple cannot ignore that fact forever.

PWA on iOS - Current status [2024]

As of 2023-2024, Progressive Web Apps (PWAs) on iOS have evolved significantly, offering a more native app-like experience. While they still face certain limitations on iOS compared to Android, recent updates have brought improvements.

Key updates and features of PWAs on iOS include:

1. Home screen addition ‍

Although Safari doesn't provide an automatic installation prompt, users can still add PWAs to their home screen. iOS 13 introduced a new Share Sheet design, making this process more intuitive with visual cues from the apple-touch-icon meta tag.

Recent improvements

iOS 13 introduced changes to the Share Sheet, which affected how users add PWAs to their home screen. The design of the Share Sheet was updated, and it's recommended for developers to adjust their apps accordingly, particularly since Safari now uses the apple-touch-icon for the home screen icon, enhancing visual recognition for the user.

Limitations

No automatic prompt : Unlike Android, iOS does not provide an automatic installation prompt from within Safari, so the process is less intuitive and relies on user action.
Dependence on Safari's capabilities : The functionality and appearance of the PWA when launched from the home screen depend on Safari's capabilities, as it is the underlying browser for PWAs on iOS.
User engagement : Adding a PWA to the home screen can significantly increase user engagement and retention, as it makes the app more accessible and convenient to use.
Branding opportunity : The presence of the app icon on the home screen serves as a constant visual reminder of the app, reinforcing brand presence.

2. Dark mode support ‍

PWAs on iOS 13 can support Dark Mode, aligning with the wider adoption of this feature across platforms.

Consistency with device settings : On iOS, PWAs that support Dark Mode can align with the system-wide Dark Mode settings of the device. This means the PWA can automatically switch between light and dark themes based on the user's system preferences.
Implementation : Implementing Dark Mode in a PWA involves using CSS media queries to detect the preferred color scheme of the user's device. Developers can then apply different styles or themes based on this preference. The relevant CSS feature is prefers-color-scheme , which can be set to light or dark .

iOS-specific considerations

Safari compatibility : For PWAs on iOS, Dark Mode support hinges on Safari's support for the prefers-color-scheme media query. Fortunately, recent versions of Safari on iOS do support this feature.
Limitations : While PWAs can adapt their styles to match the Dark Mode setting, there are limitations in how far this integration goes. For example, it's not currently possible to change the app icon dynamically based on the theme.
User preference respect : An important aspect of implementing Dark Mode is respecting the user's system settings, providing a seamless experience that matches their overall device usage.

Read also: 5 Best PWA Examples

3. Motion sensor API ‍

From iOS 13 onwards, apps need to ask for permission to use motion sensors like the accelerometer and gyroscope, a change aimed at enhancing user privacy.

User permission : One of the key aspects of using the Motion Sensor API on iOS is the requirement for explicit user permission. Due to privacy concerns and potential misuse, Apple mandates that apps request and obtain user consent before accessing motion sensor data.
iOS 13 changes : With iOS 13, there were significant changes to the Motion Sensor API usage. Previously, these sensors were freely accessible; however, the update introduced stricter controls, requiring apps to explicitly ask for permission.

Impact on PWAs

Enhanced interactivity : For PWAs, the ability to use motion sensors opens up new possibilities for user interaction and engagement. It allows for more dynamic and responsive app designs, particularly in gaming, fitness apps, or any application where device movement can be a meaningful input.
User privacy and security : The requirement for explicit permission aligns with broader trends towards user privacy and security. While it adds an extra step in the user experience, it ensures users are aware of and consent to the data being used.
Cross-platform considerations : Developers need to be aware of how different platforms handle motion sensor access. While iOS requires explicit permission, the approach may differ on other platforms like Android.

4. iPadOS distinctions ‍

With the introduction of iPadOS, iPads now offer a desktop-class browser experience. However, PWAs on iOS 13 do not automatically adjust their layout when switching to/from Split Mode on iPads.

iPadOS, while sharing a foundation with iOS, brought specific changes that impact the behavior and capabilities of PWAs on iPad devices.

Desktop-class browsing experience ‍

One of the major shifts with iPadOS is the provision of a desktop-class browsing experience in Safari. This means that websites and PWAs are rendered in a way that is more akin to the desktop version rather than the mobile version. This change enhances usability and functionality, especially for complex web applications.

Development considerations

Responsive design : Developers need to ensure their PWAs are responsive and adaptable to different screen sizes and modes, especially considering the variable rendering between full-screen and Split View modes.
Testing across modes and devices : Thorough testing across various iPad models and configurations (including Split View and Slide Over) is crucial to ensure a consistent and user-friendly experience.
Leveraging iPad features : Developers should consider how to best use iPad-specific features like the Apple Pencil or trackpad support to enhance the functionality and appeal of their PWAs.

5. Enhanced PWA installability and accessibility ‍

With updates like the "Add To Dock" button on desktop Safari and the "Add To Home Screen" button in in-app browsers using Safari View Controller, Apple has made installing and accessing PWAs more straightforward and user-friendly. These updates are part of a broader effort to improve the overall usability and appeal of PWAs on iOS platforms

Streamlined addition to home screen : A key aspect of PWA installability on iOS is the ability for users to add these web apps to their home screen. While iOS traditionally hasn't provided an automatic installation prompt for PWAs like Android does, improvements in the ease of adding PWAs to the home screen have been noted. This involves using the Safari browser's share options to manually add the PWA to the home screen.
Improved web app manifest support : The web app manifest is a crucial component for PWAs, as it defines the app's appearance when installed on the home screen, including icons, start URL, and display mode. Enhanced support for the web app manifest in Safari on iOS improves the overall installation and user experience, making PWAs feel more like native apps.
Full-screen and standalone modes : Enhancements in full-screen and standalone modes for PWAs on iOS provide a more immersive user experience. When launched from the home screen, these PWAs can operate in a mode that's visually similar to native apps, without the typical browser UI elements.
Increased storage quotas : Recent updates to Safari on iOS have included increases in the storage quotas assigned to web apps, including PWAs. This enhancement is significant for PWAs that need to store more data on the device, improving their functionality and user experience.
Safari improvements : Ongoing updates to Safari, the primary browser for iOS, directly influence PWA capabilities. Enhanced support for modern web standards and APIs in Safari boosts the functionality and reliability of PWAs on iOS devices.
Greater focus on security and privacy : With growing concerns around data security and user privacy, enhancements in these areas are also expected to continue, ensuring that PWAs offer a safe and secure experience for users.
Accessibility enhancements : Improvements in accessibility features, ensuring PWAs are usable by people with various disabilities, are also a key focus. This includes better screen reader support, improved keyboard navigation, and adherence to WCAG guidelines.

6. Improved user interaction ‍

Features like Pointer Events allow PWAs to detect whether interactions are made via finger, Apple Pencil, or mouse, particularly useful on iPadOS.

Touch and gesture controls : Enhanced support for touch and gesture controls is crucial for PWAs on iOS. This includes smooth scrolling, pinch-to-zoom, and swipe gestures that are expected in a native app experience. Improvements in these areas make PWAs feel more natural and intuitive to use on touch-screen devices.
Responsive design and layouts : With diverse iOS devices, including various models of iPhones and iPads, responsive design is essential. This means PWAs need to adapt seamlessly to different screen sizes and orientations, providing an optimal user experience across all devices.
Animation and transition effects : Smooth and appealing animations and transition effects can significantly enhance user interaction in PWAs. These visual cues not only make the app more engaging but also help in guiding users through the app’s functionality.
Performance optimization : Fast loading times and efficient performance are key aspects of user interaction. This includes optimizing images, scripts, and leveraging browser caching to ensure the PWA is responsive and efficient.
Improved offline capabilities : Enhancements in offline functionality, such as better data caching and offline content availability, contribute significantly to user interaction. Users expect a degree of functionality even when they are not connected to the internet.

7. Development and inspection tools ‍

PWAs are now inspectable on iOS, facilitating the development process.

Development tools for PWAs on iOS

Web development IDEs : Integrated Development Environments (IDEs) like Visual Studio Code, Sublime Text, and Atom are popular for PWA development. They offer features like syntax highlighting, code completion, and extensions/plugins specifically useful for web development.
Framework and library support : Frameworks like React, Angular, and Vue.js, along with libraries like Ionic, are instrumental in PWA development. They provide a structured way to build dynamic web applications that can function as PWAs.
PWA builders : Tools like PWABuilder or PWA Studio by Magento offer simplified ways to create PWAs. They can generate service workers, manifests, and even package PWAs for different platforms, including iOS.
Testing and debugging tools : Tools like Lighthouse (for performance and quality auditing), Chrome DevTools (for debugging), and BrowserStack (for cross-browser testing) are essential in the PWA development lifecycle.

Inspection tools for PWAs on iOS

Safari developer tools : For PWAs on iOS, Safari's built-in developer tools are crucial. They allow developers to inspect, debug, and optimize their web applications for Safari on iOS devices.
Remote debugging : Tools like Safari Web Inspector enable remote debugging of PWAs running on iOS devices. This is vital for testing and ensuring that the PWA behaves as expected on actual iOS hardware.
Performance monitoring tools : Tools like Google's Lighthouse provide audits for performance, accessibility, progressive web apps, SEO, and more, offering valuable insights for optimizing PWAs for iOS.
Service worker testing tools : Since service workers are a core component of PWAs, tools that facilitate testing and debugging of service workers are essential. This includes checking offline capabilities, caching strategies, and background sync functionality.

8. Background running and app switcher integration ‍

PWAs on iOS now have improved background running capabilities. They can run in the background and reflect their state in the App Switcher, similar to native apps. This development, although still subject to certain restrictions, marks a significant step towards offering a more native app-like experience

Background running in PWAs on iOS

Limited background execution ‍

Traditionally, PWAs and web apps on iOS have had limited capabilities in running in the background compared to native apps. This is due to the restrictions iOS places on background processes to conserve battery life and maintain performance.

Service Workers ‍

Service workers, a core technology behind PWAs, do run in the background, but their functionality is mainly focused on caching and push notifications (where supported). This enables some level of offline functionality and content updating in the background.

Recent enhancements ‍

There have been improvements in how PWAs handle background tasks on iOS. For instance, more recent versions of iOS started to allow some form of background processing for web apps, but with certain limitations and conditions, especially regarding timers and resource management.

App Switcher integration

Enhanced User Experience

Integration with the iOS app switcher is crucial for a seamless user experience. It allows users to view and switch between apps, including PWAs, as they would with native applications.

App state preservation ‍

For a PWA to be practical and user-friendly, it should maintain its state when a user switches to another app and then returns. This means that the PWA should resume where the user left off, without reloading or losing progress.

Visual representation ‍

In the app switcher, the PWA should ideally have a representative preview and icon, making it easily recognizable to the user. This visual representation is typically handled by the PWA's manifest settings and how the app is coded to behave in multitasking environments.

PWA on iOS - Limitations for users

The current limitations for users of Progressive Web Apps (PWAs) on iOS include:

No push notifications ‍

One of the most significant limitations for PWAs on iOS is the lack of support for push notifications. This impacts the ability of PWAs to engage users proactively, which is a key feature in many native apps.

Installation process ‍

Unlike native apps, PWAs don't have an automatic installation prompt in Safari. Users must manually add PWAs to their home screen, which may not be as intuitive as the installation process for native apps from the App Store.

Limited interaction with device features ‍

Certain device features and sensors may not be fully accessible or supported in PWAs on iOS. For example, while geolocation is supported, other functionalities like USB and Bluetooth connectivity are limited.

Variable performance across devices ‍

The performance and behavior of PWAs can vary across different iOS devices, particularly when considering the diverse capabilities and specifications of iPhones and iPads.

Limited offline capabilities ‍

While PWAs can work offline, their capabilities in this mode might be limited compared to native apps. The extent of offline functionality depends on how the PWA is designed and what data it caches.

App store discoverability ‍

While it's possible to submit PWAs to the App Store, they need to offer more than just a repackaged website. This can create a hurdle for PWA developers looking to leverage the App Store for discoverability.

Browser dependency ‍

PWAs on iOS rely heavily on Safari's capabilities and limitations, as it's the primary browser used for PWAs on Apple devices. Any limitations in Safari directly impact the capabilities of PWAs.

Limited support for advanced web features ‍

Safari's slower adoption of new web standards can limit the functionality of PWAs on iOS. For instance, features like Web Bluetooth or advanced payment options may not be available.

User Experience inconsistencies ‍

There can be inconsistencies in the user experience when using PWAs on iOS, especially when comparing them with their native app counterparts or their performance on other platforms like Android.

App state management ‍

Issues with managing the app state and layout changes, especially in the context of iPadOS and its Split Mode, can affect the usability of PWAs.

Read also: Legacy Application Modernization Roadmap - a Step-by-Step Guide. Feel like the software in your company is no longer effective and has become a development blocker? That could mean it's time for a major update!

Want to build a Progressive Web App? Here's what to consider

Advantages of building a pwa for ios.

Broader reach and accessibility : PWAs can be easily accessed via a web browser, without the need for downloading from an app store. This can expand your app's reach to a wider audience.
Reduced development costs : Developing a PWA can be more cost-effective than creating a native app, especially if you aim to support multiple platforms. You can use a single codebase for both iOS and Android, reducing development and maintenance costs.
Improved performance and features : Recent advancements in PWAs, such as the addition of push notifications, enhanced offline capabilities, and background running, make them more competitive with native apps in terms of functionality.
Ease of updating : PWAs can be updated more easily than native apps. Updates are deployed on the server side, eliminating the need for users to download updates from the App Store.

Considerations and challenges

User Experience : While PWAs have improved significantly, there may still be some gaps in user experience compared to native apps, especially in terms of advanced features and integration with iOS-specific functionalities.
App store presence : PWAs are not distributed through the App Store, which can be a significant channel for user discovery and trust. Depending on your target audience, not being on the App Store could be a limitation.
Limited access to iOS features : PWAs may not have access to all iOS features and capabilities that native apps do, such as certain hardware integrations and advanced APIs.
Variable performance across devices : PWAs can behave differently across various iOS devices, depending on factors like browser capabilities and hardware specifications.

Tips for building a PWA for iOS

Focus on performance : Ensure your PWA is optimized for performance, especially on mobile devices. This includes fast loading times, efficient use of data, and smooth animations.
Design for mobile-first : Prioritize a responsive, mobile-first design to provide a seamless experience on iOS devices.
Test extensively : Thoroughly test your PWA on multiple iOS devices and browsers to identify and fix any compatibility or performance issues.
Leverage latest web capabilities : Stay updated with the latest web technologies and standards to enhance the capabilities of your PWA.
Consider user engagement strategies : Since PWAs don't support all native features, think creatively about user engagement strategies. For example, consider alternative methods for push notifications if they are crucial for your app.
Prepare for offline use : Implement service workers for offline support, which is a key feature of PWAs.

Read also: DORA Metrics: 4 Ways to Measure Software Delivery Performance . Improved processes and fast, stable delivery ﹣that’s what you get after starting to measure your team’s performance with DORA metrics. Learn how each of the metrics works and set the path to boosting your team’s performance and business results.

Progressive Web Apps + iOS – A slow evolution

As you can see, things are changing slowly. Even if they don’t say it out loud, Apple has moved a bit closer to Progressive Web Apps. While the development of Progressive Web Apps for iOS is still more difficult than for the Android-based phones, it gets better over time. And there’s no doubt your business can still benefit from PWAs. Even on iOS.

Our company invests time in Progressive Web Apps by developing and popularizing them. If you’re more interested in this topic, let’s stay in touch.

Frequently Asked Questions

Our promise

Every year, Brainhub helps 750,000+ founders, leaders and software engineers make smart tech decisions. We earn that trust by openly sharing our insights based on practical software engineering experience.

A serial entrepreneur, passionate R&D engineer, with 15 years of experience in the tech industry. Shares his expert knowledge about tech, startups, business development, and market analysis.

Software development enthusiast with 7 years of professional experience in the tech industry. Experienced in outsourcing market analysis, with a special focus on nearshoring. In the meantime, our expert in explaining tech, business, and digital topics in an accessible way. Writer and translator after hours.

Popular this month

previous article in this collection

It's the first one.

next article in this collection

It's the last one.

DEV Community

Posted on Jun 6, 2023

Safari 17 Beta: A Game Changer for PWAs on MacOS

Safari 17 Beta is the latest version of Apple's web browser, which was released on June 5, 2023. It includes many new features and improvements for web developers, especially for those who create Progressive Web Apps (PWAs).

If you are not familiar with PWA, PWAs are web applications that offer a native app-like experience to users. They can be installed on various devices, including MacOS, and can work offline, send push notifications, and access device features.

In this blog post, I will highlight some of the new WebKit features that Safari 17 Beta supports for PWAs.

New WebKit Features for PWAs

Web Share API Level 2 : This API allows PWAs to share files with other apps on the device, such as photos, videos, or documents. It also supports sharing multiple files at once.
Web App Manifest : This is a JSON file that describes a PWA, such as its name, icons, start URL, display mode, and more. Safari 17 Beta supports more manifest properties than before, such as categories , description , and screenshots .
Web App Banner : This is a prompt that appears on Safari when a user visits a PWA that can be installed on the device. Safari 17 Beta improves the appearance and behavior of the banner, making it more consistent with native app banners.
Service Workers : These are scripts that run in the background and enable PWAs to work offline, sync data, send push notifications, and more. Safari 17 Beta improves the performance and reliability of service workers, and adds support for some new APIs, such as CacheStorage and Background Sync .
Web Push API : This API allows PWAs to send push notifications to users even when they are not using the app. Safari 17 Beta adds support for silent push notifications, which can be used to update the app's content or state without alerting the user.

Advantages of PWAs for Developers

PWAs offer many advantages for developers, and on MacOS right now, as well. Some of them are:

They are easier and cheaper to develop and maintain than native apps, as they use web technologies and standards.
They can reach a wider audience, as they are compatible with different browsers and devices.
They can leverage the features and performance of Safari, which is the default browser on MacOS and supports many PWA capabilities.
They can provide a seamless user experience, as they can adapt to different screen sizes and orientations, work offline, and update automatically.

PWAs are a great way to create engaging and reliable web applications that can run on MacOS and other platforms. If you want to learn more about PWAs, you can check out this guide from Google.

Are you interested in learning GitHub but don't know where to start? Try my course on LinkedIn Learning: Learning GitHub .

Thanks for reading this post, I hope you found it interesting!

Feel free to follow me to get notified when new articles are out 🙂

Emanuele Bartolesi Follow

Top comments (4).

Templates let you quickly answer FAQs or store snippets for re-use.

Location Frankfurt
Education BSc Advanced Technology @ University of Twente
Work Founder @ Webshift
Joined Feb 28, 2023

I am really thinking about this a lot and could image the future with only PWA‘s where users do not install native apps on their devices anymore (at least that is what I would like for mobile).

What do you think? Will the PWA be able to fully replace native apps at some point?

Email [email protected]
Location Zurich, Switzerland
Pronouns he/him
Work Developer & CTO
Joined Jun 22, 2018

I am a big fan of PWA since the beginning... but I don't think they replace native apps completely... (but I would like 😀)

Joined Aug 17, 2023

There's no documented support for Web App Install Banners in Safari / iOS 17.

Here's the WWDC announcement: developer.apple.com/videos/play/ww...

and the beta release notes: developer.apple.com/documentation/...

Joined Jun 9, 2023

I’m sorry but I think Apple didn’t create web app banner !

Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment's permalink .

Hide child comments as well

For further actions, you may consider blocking this person and/or reporting abuse

Mastering useImperativeHandle in React (with TypeScript)

Serif COLAKEL - Sep 8

Create a Wordle Game in HTML,CSS, and JS

Devops Den - Sep 8

Performant Web Apps

Shubhajit Chatterjee - Sep 8

Next.js vs React - Which One to Choose?

ViitorCloud Technologies - Sep 9

We're a place where coders share, stay up-to-date and grow their careers.

Installation

Once the user installs your PWA, it will:

Have an icon in the launcher, home screen, start menu, or launchpad.
Appear as a result when a user searches for the app on their device.
Have a separate window within the operating system.
Have support for specific capabilities.

Installation criteria

Every browser has a criterion that marks when a website or web app is a Progressive Web App and can be installed for a standalone experience. The metadata for your PWA is set by a JSON-based file known as the Web App Manifest, which we will cover in detail in the next module .

As a minimum requirement for installability, most browsers that support it use the Web App Manifest file and certain properties such as the name of the app, and configuration of the installed experience. An exception to this is Safari for macOS, which does not support installability.

The requirements to allow installation differ among the different browsers, this article details the criteria for Google Chrome and includes links to requirements for other browsers.

Because the test that a PWA meets installability requirements can take several seconds, installability itself may not be available as soon as a URLs response is received.

Desktop installation

Desktop PWA installation is currently supported by Google Chrome and Microsoft Edge on Linux, Windows, macOS, and Chromebooks. These browsers will show an install badge (icon) in the URL bar (see the image below), stating that the current site is installable.

Chrome and Edge on desktop with the install badge in the URL bar

When a user is engaged with a site, they may see a popup such as the one below inviting users to install it as an app.

Google chrome in-product help suggesting the PWA installation.

The browser's drop-down menu also includes an "Install " item that the user can use:

Chrome and Edge menu items for PWA installation.

Only standalone and minimal-ui display modes are supported on desktop operating systems.

PWAs installed on desktops:

Have an icon in the Start menu or Start screen on Windows PCs, in the dock or desktop in Linux GUIs, in the macOS launchpad, or a Chromebook's app launcher.
Have an icon in app switchers and docks when the app is active, was recently used, or is opened in the background.
Appear in the app search, for example, search on Windows or Spotlight on macOS.
Can set a badge number on their icons, to indicate new notifications. This is done with the Badging API .
Can set a contextual menu for the icon with App Shortcuts .
Can't be installed twice with the same browser.

After installing an app on the desktop, users can navigate to about:apps , right-click on a PWA, and select "Start App when you Sign In" if they want your app to open automatically on startup.

iOS and iPadOS installation

A browser prompt to install your PWA doesn't exist On iOS and iPadOS. On these platforms PWAs are also known as home screen web apps . These apps have to be added manually to the home screen via a menu that is available only in Safari. It is recommended that you add the apple-touch-icon tag to your html. To define the icon, include the path to your icon to your HTML <head> section, like this:

Safari will use that information to create the shortcut and if you don't provide a specific icon for Apple devices, the icon on the home screen will be a screenshot of your PWA when the user installed it.

It's important to understand that PWA installation is only available if the user browses your website from Safari. Other browsers available in the App Store, such as Google Chrome, Firefox, Opera, or Microsoft Edge, cannot install a PWA on the home screen.

The steps to add apps to the home screen are:

Open the Share menu, available at the bottom or top of the browser.
Click Add to Home Screen .
Confirm the name of the app; the name is user-editable.
Click Add . On iOS and iPadOS, bookmarks to websites and PWAs look the same on the home screen.

On iOS and iPadOS, only the standalone display mode is supported. Therefore, if you use minimal UI mode, it will fall back to a browser shortcut; if you use fullscreen, it will fall back to standalone.

PWAs installed on iOS and iPadOS:

Appear in the home screen, Spotlight's search, Siri Suggestions, and App Library search.
Don't appear in App Gallery's categories folders.
Lack support for capabilities such as badging and app shortcuts.

Incidentally, Safari uses a native technology known as Web Clips to create the PWA icons in the operating system. They are just XML files in Apple's Property List format stored in the filesystem.

Android installation

On Android, PWA install prompts differ by device and browser. Users may see:

Variations in the wording of the menu item for install such as Install or Add to Home Screen .
Detailed installation dialogs.

In the following image you can see two different versions of an installation dialog, a simple mini-infobar (left) and a detailed installation dialog (right).

Mini info bar and installation dialogs on Android.

Depending on the device and browser, your PWA will either be installed as a WebAPK, a shortcut, or a QuickApp.

A WebAPK is an Android package (APK) created by a trusted provider of the user's device, typically in the cloud, on a WebAPK minting server . This method is used by Google Chrome on devices with Google Mobile Services (GMS) installed, and by Samsung Internet browser, but only on Samsung-manufactured devices, such as a Galaxy phone or tablet. Together, this accounts for the majority of Android users.

When a user installs a PWA from Google Chrome and a WebAPK is used, the minting server "mints" (packages) and signs an APK for the PWA. That process takes time, but when the APK is ready, the browser installs that app silently on the user's device. Because trusted providers (Play Services or Samsung) signed the APK, the phone installs it without disabling security, as with any app coming from the store. There is no need for sideloading the app.

PWAs installed via WebAPK:

Have an icon in the app launcher and home screen.
Appear on Settings, Apps.
Can have several capabilities, such as badging , app shortcuts , and capture links within the OS .
Can update the icon and app's metadata.
Can't be installed twice.

While WebAPKs provide the best experience for Android users, they can't always be created. When they can't, browsers fall back to creating a website shortcut. Because Firefox, Microsoft Edge, Opera, Brave, and Samsung Internet (on non-Samsung devices) don't have minting servers they trust, they'll create shortcuts. Google Chrome will too if the minting service is unavailable or your PWA doesn't meet installation requirements.

PWAs installed with shortcuts:

Have a browser-badged icon on the home screen (see the following examples).
Don't have an icon in the Launcher or on Settings, Apps .
Can't use any capabilities that require installation.
Can't update their icons and app metadata.
Can be installed many times, even using the same browser; when this happens, all will point to the same instance, and use the same storage.

A PWA installed with different browsers on the same device.

Some manufacturers, including Huawei and ZTE, offer a platform known as QuickApps to create light web apps similar to PWAs but using a different technology stack. Some browsers on these devices, like the Huawei browser, can install PWAs that get packaged as QuickApp, even if you are not using the QuickApp stack.

When your PWA is installed as a QuickApp, users will get a similar experience to the one they would have with shortcuts, but with an icon badged with the QuickApps icon (a lightning image). The app will also be available to launch from the QuickApp Center.

QuickApps on a Huawei or ZTE home screen.

Prompting for installation

In Chromium-based browsers on desktop and Android devices, it's possible to trigger the browser's installation dialog from your PWA. The Installation Prompt chapter , will cover patterns for doing so and how to implement them.

App catalogs and stores

Your PWA can also be listed in app catalogs and stores to increase its reach and let users find it in the same place they find other apps. Most app catalogs and stores support technologies that let you publish a package that doesn't include the whole web app (such as your HTML and assets). These technologies let you create just a launcher to a standalone web rendering engine that will load the app and let the service worker cache the necessary assets.

The app catalogs and stores that support publishing a PWA are:

Google Play Store for Android and ChromeOS , using a Trusted Web Activity .
Apple App Store for iOS, macOS, and iPadOS, using WKWebView and App-Bound Domains .
Microsoft Store for Windows 10 and 11 , using APPX packages.
Samsung Galaxy Store , using the Samsung WebAPK minting server.
Huawei AppGallery, using a QuickApp container for your HTML application .

If you want to learn more about how to publish a PWA to app catalogs and stores, check out BubbleWrap CLI and PWA Builder .

What does it take to be installable
WebAPKs on Android
Patterns for promoting PWA installation
Using a PWA in your Android app
List your Progressive Web App in Google Play
Submit your PWA to the Microsoft Store
Publishing a PWA to App Store
WebKit: App-Bound Domains

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License , and code samples are licensed under the Apache 2.0 License . For details, see the Google Developers Site Policies . Java is a registered trademark of Oracle and/or its affiliates.

Last updated 2022-01-10 UTC.

Skip to main content
Skip to search
Skip to select language
Sign up for free

Making PWAs installable

One of the defining aspects of a PWA is that it can be promoted by the browser for installation on the device. Once installed, a PWA appears to users as a platform-specific app, a permanent feature of their device which they can launch directly from the operating system like any other app.

We can summarize this as follows:

Supporting browsers promote the PWA to the user for installation on the device.
The PWA can be installed like a platform-specific app, and can customize the install process.
Once installed, the PWA gets an app icon on the device, alongside platform-specific apps.
Once installed, the PWA can be launched as a standalone app, rather than a website in a browser.

We'll discuss each of these features in this guide. First, though, we'll discuss the requirements that a web app must meet for it to be promoted for installation.

Installability

For a web app to be promoted for installation by a supporting browser, it needs to meet some technical requirements. We can consider these the minimum requirements for a web app to be a PWA.

Note: While not a requirement for a PWA to be installable, many PWAs use service workers to provide an offline experience. See the CycleTracker: Service workers tutorial for more information.

The web app manifest

A web app manifest is a JSON file that tells the browser how the PWA should appear and behave on the device. For a web app to be a PWA it must be installable, and for it to be installable it must include a manifest.

The manifest is included using a <link> element in the app's HTML:

If the PWA has more than one page, every page must reference the manifest in this way.

The manifest contains a single JSON object containing a collection of members, each of which defines some aspect of the PWA's appearance or behavior. Here's a rather minimal manifest, containing just two members: "name" and "icons" .

Required manifest members

Chromium-based browsers, including Google Chrome, Samsung Internet, and Microsoft Edge, require that the manifest includes the following members:

name or short_name
icons must contain a 192px and a 512px icon
display and/or display_override
prefer_related_applications must be false or not present

For a full description of every member, see the Web app manifest reference documentation.

HTTPS, localhost, or loopback are required

For a PWA to be installable it must be served using the https protocol, or from a local development environment using localhost or 127.0.0.1 — with or without a port number.

This is a more stringent requirement than secure context , which considers resources loaded from file:// URLs to be secure.

Installation from an app store

Users expect to find apps in the app store for their platform, like the Google Play Store or the Apple App Store.

If your app meets the installability prerequisites, you can package it and distribute it through app stores. The process is specific to each app store:

How to publish a PWA to the Google Play Store
How to publish a PWA to the Microsoft Store
How to publish a PWA to the Meta Quest Store

The PWABuilder is a tool to simplify the process of packaging and publishing a PWA for various app stores. It supports the Google Play Store, Microsoft Store, Meta Quest Store, and iOS App Store.

If you have added your app to the app store, users can install it from there, just like a platform-specific app.

Installation from the web

When a supporting browser determines that a web app meets the installability criteria described earlier, it will promote the app to the user for installation. The user will be offered the chance to install the app. This means you can distribute your PWA as a website, making it discoverable through web search, and also distribute it in app stores, so users can find it there.

This is a great example of the way PWAs can offer you the best of both worlds. It's also a good example of how progressive enhancement works with PWAs: if a user encounters your PWA on the web, using a browser that can't install it, they can use it just like a normal website.

The UI for installing a PWA from the web varies from one browser to another, and from one platform to another. For example, a browser might include an "Install" icon in the URL bar when the user navigates to the page:

Chrome URL bar, showing PWA install icon

When the user selects the icon, the browser displays a prompt asking if they want to install the PWA, and if they accept, the PWA is installed.

The prompt displays the name and icon for the PWA, taken from the name and icons manifest members.

Browser support

Support for PWA installation promotion from the web varies by browser and by platform.

On desktop:

Chromium browsers support installing PWAs that have a manifest file on all supported desktop operating systems.
Firefox and Safari do not support installing PWAs using a manifest file.
On Android, Firefox, Chrome, Edge, Opera, and Samsung Internet Browser all support installing PWAs.
On iOS 16.3 and earlier, PWAs can only be installed with Safari.
On iOS 16.4 and later, PWAs can be installed from the Share menu in Safari, Chrome, Edge, Firefox, and Orion.

Installing sites as apps

Chrome for desktop and Android, Safari for desktop, and Edge for desktop also support users installing any website as an app, whether or not it has a manifest file, and without regard to the installability criteria for the manifest file. The benefit of using a manifest file is that the browser will actively promote the site for installation when it is visited, and developers can customize installation behavior.

Triggering the install prompt

A PWA can provide its own in-page UI for the user to open the install prompt, instead of relying on the UI provided by the browser by default. This enables a PWA to provide some context and a reason for the user to install the PWA, and can help make the install user flow easier to discover.

This technique relies on the beforeinstallprompt event, which is fired on the global Window object as soon as the browser has determined that the PWA is installable. This event has a prompt() method that shows the install prompt. So a PWA can:

add its own "Install" button
listen for the beforeinstallprompt event
cancel the event's default behavior by calling preventDefault()
in the event handler for its own "Install" button, call prompt() .

This is not supported on iOS.

Customizing the installation prompt

By default, the install prompt contains the name and icon for the PWA. If you provide values for the description and screenshots manifest members, then, on Android only, these values will be shown in the install prompt, giving the user extra context and motivation to install the PWA.

The screenshot below shows what the install prompt for the PWAmp demo looks like on Google Chrome, running on Android:

Launching the app

Once the PWA is installed, its icon is shown on the device alongside any other apps that the user has installed, and clicking the icon launches the app.

You can use the display manifest member to control the display mode : that is, how the PWA appears when it is launched. In particular:

"standalone" indicates that the PWA should look and feel like a platform-specific application, with no browser UI elements
"browser" indicates that the PWA should be opened as a new browser tab or window, just like a normal website.

If the browser does not support a given display mode, display will fall back to a supported display mode according to a predefined sequence. The display_override enables you to redefine the fallback sequence.

Web Apps on macOS Sonoma got a proper install experience

With the release of macOS Sonoma, we are excited to see Apple making a big step forward in supporting Web Apps in general and Progressive Web Applications specifically. This is great news for developers and users alike, as it means that PWAs will be more accessible on Mac than ever before.

Unfortunately, there is no built-in browsers experiences for prompting PWA installation on Safari. This is where the pwa-install component comes in. It’s a simple, lightweight, framework agnostic web-component that provides a native-like installation experience for PWAs on iOS/iPadOS and now on macOS Sonoma. It’s easy to use and works with any PWA or simple Web App, so you can get started right away.

Why does easy installation matter? Progressive Web Applications offer a lot of flexibility and user engagement. One of the main selling points is their app-like presence on your device. However, not every browser has made it easy to install them. This update is set to make the installation of PWAs feel more native, especially for users on macOS Safari.

Implementation

But how it was archived? Safari on macOS Sonoma supports the Web App Manifest, which is a JSON file that describes the Web App metadata. This includes the app’s name, description, icons, and more. The pwa-install component uses this information to create a native-like installation experience for PWAs on iOS/iPadOS and macOS Sonoma.

But here’s a catch: Safari on macOS doesn’t provide any API to detect Web Apps availability. So, we used a workaround to detect Web Apps availability on macOS platform.

Here’s how it works :

When we combine the user agent and Sonoma specific Safari feature detections, we can detect Web Apps availability on macOS platform. We run previous and current macOS version with latest Safari 17 side by side and with help of tool like this , we were able to detect the difference we can use.

Installation

This isn’t just about Safari on macOS. The component keeps the user experience consistent no matter the device.

Adding this component to your project is simple. The readme includes a one-line npm install command, import instructions, and basic HTML for adding the component to an app. Here is a live demo to show you exactly how it should look and work. Most modern frameworks can use the component as a web component. React polyfill is included.

What’s coming soon for PWA installation? Samsung Internet and Firefox Mobile are the next browsers to get the pwa-install component. This will make it even easier for users on Android devices to install PWAs from their favorite browsers.

The pwa-install component aims to improve the install process for PWAs, with the most recent update making the experience feel more native for Safari users on the new macOS Sonoma. Whether you’re aiming to reach macOS, iOS, or wider audiences, this component can play for you a vital role in creating a seamless PWA installation experience.

Jump into the demo to see the new features for yourself. If you like the progress, feel free to contribute features or translations through pull requests.

Author Profile

Gleb Khmyznikov @khmyznikov

Eastern Europe based Software Engineer who loves PC hardware, gaming handhelds, classic cars and web technologies.

Progressive Web Applications (PWA) on iOS 13 & 14 Provide a Rich Channel to Reach Customers Despite the Platform Limitations

Last Updated - Sat Jan 09 2021

Progressive Web Apps are everywhere, literally. Every major browser and platform has support for service workers and are using the web manifest file in some form or fashion.

This includes Apple's iPhones and iPads using iOS Safari.

Do Progressive Web Apps (PWA) work on iOS?

The catch is Apple's implementation is somewhat restrained compared to other platforms, especially when compared to Chrome and Edge.

Stop right there!!!!

THIS DOES NOT MEAN Progressive Web Apps don't work on iOS, they do and they are great!

The limitations are limited at this time. Almost every feature you want n your application is supported by Safari on iPhone.

Safari supports service worker caching. It does not support push notifications or background sync. Safari does use parts of the web manifest file.

There is a 50MB service worker cache limit, but that does not mean you cannot persist more data. IndexedDB allows you to store a few GBs of data. It really depends, like other platforms, on the available space.

There is no native add to homescreen prompt, but other than Chrome and Edge no one else does either.Unused web apps that have not been added to the homescreen will have their cached assets purged after 7 days. This is less of a problem than most think.

That may sound like a lot is missing, but it is not as bad as it sounds.

A great feature of the web platform is the ability to progressively enhance (the progressive part of PWA) and polyfil many features when a browser does not support them natively.

To be fair Apple was really the first platform to support the concept of a web app. When they released the iPhone the first apps were HTML5 based.

As such they provided a way to manually add a website to the homescreen and launch in a full screen experience.

They kept the process simple, just sort of hidden.

Unfortunately, they never matured the experience. And service workers did not exist at the time.

Today that has changed, but like I mentioned, the iOS PWA experience is a little different than other platforms, but very serviceable. It is also improving with each Safari update.

I should note that Apple is not a fan of the term 'Progressive Web App' or 'PWA'. Instead they prefer to call them HTML Apps or Web Apps.

This is merely semantics. There is no official PWA specification, it is merely a term created to describe a modern breed of websites.

They are keen to point out that progressive web application is a term created by a Googler and initially promoted by Google. To be fair they are right.

The main takeaway from this article is why PWAs are a great choice to target iPhone and iPad users for your application. In fact Apple will probably tell you that too if you pay attention to the direction they are heading.

For now we know how Safari on iOS 13 supports modern web APIs. We are still waiting to see what updates and features will be added to iOS 14 and the next version of Safari.

Does Apple Even Want Progressive Web Apps?

Current pwa implementations have more success on ios than before, consumers are burned out on apps, pwa technology supported on ios, ios progressive web app cache capacity, does ios support push notifications, background sync on ios, ios pwa quirks.

Many wonder if Apple wants PWAs to succeed or even work on iOS and MacOS. The reason is progressive web apps compete with the AppStore.

The reality is Apple is more than willing to see apps leave the store and migrate to the web . They are doing a great job themselves of running off many brands from the AppStore as it is.

Recently they denied Hey.com's app update because they were not using Apple's in app payment services. Instead BaseCamp chose to use traditional merchant card services that charge 1-3% or 10% of Apple's 30% fee.

Spotify has filed a lawsuit against Apple's app store practices .

And then there is the Epic battle with Apple over Fortnite .

If you don't believe me, you should see app owners contacting me to create a PWA for them. Some because their apps were removed. Others because they fear removal or rejection.

By removing apps and making others 'uncomfortable' they are recommending to use the web.

Seriously, they even use that language:

"if the App Store model and guidelines are not best for your app or business idea that’s okay, we provide Safari for a great web experience too."

Clients have confirmed these Apple notices suggesting they move to the web.

So does Apple care about AppStore success? Yes, they do, but at the same time it is not their priority, selling hardware at massive margins is the goal.

Sure the AppStore generates billions in sales each year and yes Apple takes a 30% cut. But as I highlighted in the Spotify vs Apple article, much of that revenue is from a handful of apps.

I have created a litmus test to determine if your app should be native or a progressive web app: Does your app sell iPhones?

If the answer is no, then don't waste your time and money on a native app. Apple does not want you anyway.

But if you want to invest $5000-50000 on an iOS app to see if they will accept it be my guest. I am still here to make it available to everyone for less.😁

When you take the time and create a proper progressive web app you are taking the time to create a better user experience. This better UX ultimately means your customers are happier with your online experience and of course engage at higher rates.

Even with platform limitations a consistent message from brands using PWA is their iOS engagement numbers increase.

It is sort of real-world application of the 'a rising tide raises all ships' saying.

There are many PWA examples out there reporting across the board improvements to key performance indicators.

AliExpress saw an 82% increase in iOS conversions, the Washington Post saw nearly a 5x increase in user engagement and MyNet saw a 19% page view increase on iOS just to name a few sites and stats.

Even with the current limitations making a better web user experience means you will reap rewards on iOS. And eventually Apple will catch up to the competition. At least to where Chrome, Edge and other browsers are today. When those missing features light up your customers will just experience them.

Oh, and if you think having a presence in the App Store will make you successful, think again.

We know about 4 years ago consumers reached app fatigue and stopped downloading or installing apps.

Yes, apps are still downloaded, but for the most part it is the 4 or 5 apps the consumer uses the most and only when they get a new device.

For the most part these apps are Facebook. I mean Facebook, Messenger, WhatsApp and Instagram, all Facebook apps.

When you read over 80% of a consumer's screen time is in an app, almost all that time is using social media. The other apps are video, which honestly can be progressive web apps without degrading experience. I mean Netflix is phasing their apps out.

If you study mobile app consumption 99% of apps are rarely downloaded. If an app is downloaded 90% of the downloads are used once before the app is removed.

Most apps are eventually abandoned and after a while purged from the platform due to lack of interest by device owners.

Unfortunately, many still fear or falsely assume they need to have their brand in the AppStore to be found.

Are you Facebook? Are you Fortnite?

If you answered no, then most likely no one is looking for your app in the store.

They are searching for your products and services in search engines. While SEO ~ is not simple, it can provide piles of targeted traffic to your site.

Once you get them on your site you can easily remarket and engage them in your sales funnel. By the time you get them to the purchase point they don’t want to go through the 6-8 steps to download your app to their phone.

If you have a progressive web app they have already ‘installed’ the core plumbing required for your PWA experience. You just need to get them to formally install or add your PWA to their device homescreen. A far easier task than downloading an app.

I frequently read articles about limitations of progressive web apps on iOS. Most are a bit naïve and paint a much bleaker picture about capabilities than reality.

Sure, there are limitations with Apple Safari due to its laggardness in supporting modern web standards. The current joke among web developers is Safari is the new Internet Explorer.

Of course, Internet Explorer is Microsoft's old, long deprecated browser that had so much disdain passed its way. It lagged behind its rivals FireFox and then Chrome.

Today most browsers support the same modern web standards and capabilities. Most except Safari, which always seems to be at least 2-3 years behind the competition.

The story is not as bad as that sounds. The boundaries can be handled if you plan for them. And if and when Apple ships support for a feature it can just light up in your application.

I have built applications that deal with iOS limits. Even with the lack of push notifications you can fall back to SMS. Sure USB and Bluetooth are not supported, but the demand for these APIs is very niche.

Today's modern standards have elevated the web platform to almost even parity with native counterparts. Sure there are a few edge cases where the web does not have a viable specification. But these missing features tend to have rare implementations even with native apps.

So yeah, right now the web does not offer Geo-Fencing, but I know very few applications that leverage this technology anyway, so I am not that concerned.

As for progressive web applications, what they are and what they can do that mere websites can do is well, no different.

To be classified as a progressive web application there are 3 criteria:

Register a Service Worker with a fetch event handler
Valid web manifest file with a minimal homescreen icon set

That is the bare minimum, but of course there is more to the puzzle.

PWAs are just websites, but they differ from a common website in that they have those three technical features but are designed to just plain be better.

Ambiguous and anecdotal as you can get. Yes, it is the eye of the beholder if you will.

The thing about a progressive web app that makes them stand out can often be just taking advantage of platform APIs like Geolocation , biometric authentication, the payment request API, Bluetooth, Camera, Web Share and many other user experience APIs available today.

When you really boil it down, Progressive Web Applications deliver a superior user experience. This user experience gracefully degrades when the browser does not support a modern feature.

In other words, the web site provides the best possible experience the browser allows.

I find it frustrating how many of these features are assumed to not be supported or worse brand new when they have existed for years.

For example, Geolocation has been supported by all browsers for a decade.

Biometric authentication, i.e. fingerprint or facial recognition enjoys support among most browsers via the WebAuthn specification . For the record iOS Safari has shipped support .

As far as PWA support on iOS the only core thing missing is the support of the web manifest. The file that provides enhanced meta data about the web site to the browser. It facilitates the add to homescreen experience .

Apple has shipped limit support, or really partial use, for this feature. It is not a deal breaker.

That's right, a web manifest file is not required for a great user experience, and you CAN add a progressive web app to the iPhone homescreen.

iOS has had add to homescreen support on iOS since the first iPhone shipped. So rather than divert engineering resources to support this standard they focused more on catching up in the service worker space.

I think this was the right choice.

You can still include Safari's mobile-web-app-capable and touch-icon META tags in your page's HEAD without causing issues with other browsers on other platforms.

This is what is great about the web. It is very forgiving and you can add modern functionality to a website and gracefully degrade when the browser does not support a feature.

I am sure Apple will eventually support web manifest files, but for now I would prefer they focus on adding service worker features, other platform APIs and fixing bugs.

Right now, the biggest progressive web application limitation on iOS is the small cache capacity quota Apple imposes, ~50MB.

Again this is not a deal breaker for most web sites. If you need 50MB to cache your site's assets you really should revisit your application's code and caching logic.

I am working on a few projects right now that do need to cache more than 50MB, but they need to cache audio and video files. For these applications the media files can be looked at more as data rather than a network addressable resource, which is what service worker cache is really designed.

In these cases, the audio and video files can be cached using blob storage in IndexedDB, a browser database with much more available capacity. In fact, the IndexedDB capacity on iOS seems to be almost unlimited in the tests I have run, up to 1GB.

Let me put this in perspective, I have built several large web sites with 100s of unique web pages and support assets and cached everything (excluding images) in localStorage. localStorage is typically limited to 5MB, so you get the idea.

IndexedDB access is available within your service worker, where localStorage is not. This does mean you can intercept the network request to the more 'binary' responses and cache them in IDB in the service worker and sort of build a special caching abstraction layer to make managing their caching easier across different browsers.

Of course, even with Android and other mobile devices disk space is a premium. This is why Apple chose to limit service worker cache to 50MB. A 32GB phone does not have much storage once you factor in the operating system and other mandatory platform apps.

So, don't expect to be able to cache a high definition, large screen formatted movie. But audio books, podcasts and properly formatted videos should have no problem being cached on iOS.

So don't let the lack of service worker cache capacity stop you from using a Progressive Web App.

At this point in time Apple's iPhone and iPads do not support native push notifications . You can gracefully fallback to SMS notifications. Both provide high engagement levels with minimal costs.

I am asked about this more than any other web platform feature, at least it feels that way.

Even though I get frustrated with Safari's limitations it does support most modern web APIs needed to make great user experiences.

This does not mean I am not asked by clients and potential clients if they can do some pretty crazy stuff. Most of the request are often not even possible with a native app. Others violate Apple, Google and Microsoft's terms, which means native apps are rejected and the stakeholders are hoping they can use the web to achieve their goals.

As for background sync this is a bummer. However, this is not supported by browsers outside the Chromium ecosystem at the moment.

You can create your own synchronization support by leveraging offline detection and IndexedDB. The main drawback here is the user will need to open your web app in order for your fallback to work. You cannot trigger the service worker to just execute in the background when the network returns, which is the main feature of the service worker background sync API.

Another quirk PWAs have on iOS is being purged. This can be very problematic.

Recently Apple has addressed this problem. When a PWA is added to the user's homescreen the platform will retained cached assets for an indefinite period. Even more incentive too push users to install your PWA.

Because Apple assumes space on its devices is cramped, they aggressively throw unused items overboard to free up disk space. Add to homescreen seems to be a signal to the operating system the assets are more important, therefor they are retained.

If your PWA or any website for that matter, goes unused for a few days (we think it is roughly 14 days, it is not documented) the device will remove all cached assets associated with the origin. This includes IndexedDB, service worker cache, localStorage, etc. Again, this concerns sites not added to the homescreen.

This has made relying on cached assets a bit of an issue. The real problem lies when a user might try to load your PWA while they are offline for the first time in a month. The PWA won’t work, even if your service worker pre-caches all the required files for offline functionality.

You should also build in a check for purged cached assets in your service worker. I think just important is you should also include some sort of notice for your users if they expect the application to function offline.

Let them know the content they are caching now may not be available if unused for a long period of time. If they anticipate needing your app for offline usage try to plan ahead.

In theory your cached content could be purge by other browsers too, but they are not as aggressive. Providing a message to set user expectations can go a long way to curb potential issues down the road.

Sure there are limitations to for Progressive Web Apps on iOS, but they are not deal breakers. Many of the most requested features have at least some form of fallback solution. It may not provide a comparable user experience the native web platform API or service offers.

For most mobile apps, especially on iOS, are not a good channel to promote and engage your customers. App installs are rare for most apps. Development, maintenance and marketing for these apps is also very expensive.

The web, progressive web apps specially, are available to everyone in every browser on every device. Plus they can be affordably marketed using organic search, PPC and traditional marketing funnels.

Many brands have reported improved customer engagement stats after upgrading their websites to a PWA, especially on iOS. Most likely your brand will too.

Progressive Web Application Development by Example

We use cookies to give you the best experience possible. By continuing, we'll assume you're cool with our cookie policy.

Install Love2Dev for quick, easy access from your homescreen or start menu.

Advisory boards aren’t only for executives. Join the LogRocket Content Advisory Board today →

Product Management
Solve User-Reported Issues
Find Issues Faster
Optimize Conversion and Adoption
Start Monitoring for Free

When will Safari finally get it together?

The worst possible insult

Calling a browser “the new Internet Explorer” is unequivocally something that all modern browser vendors want to avoid. Unfortunately for Apple, Safari has acquired that unwanted label in specific subreddits and the vitriolic Hacker News. Internet Explorer 6 prevented web developers from using many of the latest and coolest web APIs until Microsoft officially stopped supporting it in January 2016. Safari, to a much lesser degree, was doing the same thing.

When will Safari finally get it together?

Before the 15.4 release, Safari — or specifically, the WebKit engine that powers it — was well behind their competition. PWA support pre-15.4 was limited, with no support for home screen icons and notifications. Conspiracy theorists speculated that Apple was deliberately crippling WebKit to protect its App Store business. These accusations do not hold too much water, but Safari still had a passing resemblance to the infamous Internet Explorer.

Below is the moment the penny dropped for Apple Evangelist Jen Simmons :

Everyone in my mentions saying Safari is the worst, it’s the new IE… Can you point to specific bugs & missing support that frustrate you, inhibit you making websites/apps. Bonus points for links to tickets. Specifics we can fix. Vague hate is honestly super counterproductive. — Jen Simmons (@jensimmons) February 8, 2022

Many of us are old enough to remember the dark days of IE 6–11, when web developers embarked on a cycle of fixing bugs specifically and only for IE at the end of each development cycle.

With the advent of the auto-updating Internet Explorer Edge, and Microsoft also helping to rid the world of its old, pre-Edge browsers, Safari has found itself struggling for any popularity.

According to the Web Platform Tests dashboard, Safari jumped from 50 points to 72 on the interop 2022 dashboard with the 15.4 release. So, is there any truth in this scurrilous accusation that Safari is the new IE?

Why did Safari get the title of “The new IE”?

One of the main reasons for Safari’s unflattering new title is that Apple, in its wisdom, ties its browser releases to macOS releases. This makes it take weeks or months to release critical bug fixes. Many, including Rich Harris, have publicly commented on this being a primary pain point for developers:

Exactly this. If browser updates weren’t coupled to OS updates, many of the (legitimate) complaints would vanish. The reason people make ‘counterproductive’ complaints about ‘fixed’ bugs is that users still experience them, because Safari isn’t evergreen https://t.co/nTvlFPvPjV — Rich Harris (@Rich_Harris) February 22, 2022

In comparison, Chrome has a four-week release cycle. But Safari can take months to ship a minor release:

Updates are considered opaque, with no roadmap publicly available and few signals for when new features or bug fixes are expected to arrive.

PWA support has made Safari the poorest relation of Chrome and Firefox. A lack of push notifications is a huge miss for any developer wanting to create an app-like experience in the browser. No support for lazy loading images was a huge hole that needed filling.

Apple added WebRTC support in June 2017, which is roughly four and a half years after Chrome officially added it out-of-the-box. You could argue that this delay impeded wider WebRTC adoption.

Before the 15.4 release , it would be fair to say that Apple had dropped the ball. They at least needed to spit and polish the ailing Safari. Did they succeed?

Safari puts the world to rights with release 15.4

Apple has added 70 new features in release 15.4 . Seventy new features is a significant release that flies in the face of the modern continuous delivery practice of releasing small and often. In comparison, Chrome 99 had 28 security fixes.

One of these is — finally — the ability to lazy-load images, an absolute must for bundle size-conscious and latency-aware developers. Let’s not forget, though, that his has been a feature in Chrome since version 77, released in 2019, and Firefox since version 75, released in 2020.

Safari’s PWA support has improved with this release, and declaring icons in the web app manifest is finally supported. The service worker navigationPreload is a welcome addition that can decrease startup time by allowing network requests to happen in parallel with serviceworker startup. Unfortunately, there is still only experimental support for push notifications.

Any web developer worth their salt has fought many scrolling bugs on both desktop and mobile Safari. The 15.4 release introduces smooth-scrolling , giving developers the ability to instantly jump from position to position and smoothly animate the scroll operation.

Another notable addition is perfect WebRTC negotiation that finally aligns Safari with the WebRTC 1.0 specification . To put this in context, Chrome started adding WebRTC support in Chrome 47, released in 2015, and Firefox started adding support in Firefox 20 released in 2013. Safari was very late to the party and started adding WebRTC support in Safari 13.5, released in 2020!

What we did not get in 15.4

No push notifications is a glaring omission from this release that has brought the ire of many PWA developers. Web apps or PWAs cannot provide experiences in Safari that are comparable to those in Chrome or Firefox until this feature is added in a non-experimental way on both desktop and mobile. It is a pity this is still experimental because this is still a gaping hole that needs filling for genuine PWA support.

Another feature that keeps me tied to Chrome is profiles . As a freelance software developer, I might have multiple accounts on the go during a working day, and being able to tie these together in Chrome profiles is a productivity boon that others should be innovating on.

Did Safari succeed with 15.4?

Apple deserves a lot of credit for the 15.4 release, and I hope subsequent minor and major releases continue to move the needle in such giant leaps. Apple does, at least now, seem aware of developers’ current perception of Safari, and significant resources do appear to be working to improve Safari.

On mobile devices, Safari is still a clear second place in global market share, and Apple needs at the very least to cement this position to stay in the game, and then push for number one.

We need innovation, and Chrome needs competition

At publication time, Chrome is just too dominant. It has north of 60 percent of market share on both desktop and mobile devices globally.

Over 200k developers use LogRocket to create better digital experiences

Source: StatCounter Global Stats – Browser Market Share

A consequence of this dominance is that Google developers get too much say in important conversations, such as TC39 meetings. They bring too many proposals that fit their own needs, such as protobuf and Brotli , that end up taking away from other ideas non-Google developers propose. For one, they completely shut down Promise cancellation in one sad GitHub issue that will always stick out in my mind.

The non-Chrome browsers draw comparisons with the search engine DuckDuckGo , a competitor to Google Search that I want to succeed, but I still use Google as the results are better.

Competition breeds innovation, and we need viable alternatives to push the technology forward. Unfortunately, developing against Chrome is the most suitable place for me where I get stuff done fast at this time of writing. I can’t afford to make a stand that does not make ergonomic sense, but Apple has both the money and development resources to at least level the playing field, if not make Safari a true competitor. But it seems, at least pre-15.4, that they’ve either deliberately chosen not to or were unaware of the need.

What’s next?

The next step for Safari is a clear roadmap and a better update story. I am unaware of the Chrome version number as updates just happen, but I am all too aware of both Safari (and Internet Explorer) versions now. Version numbers should be irrelevant, not infamous.

Get set up with LogRocket's modern error tracking in minutes:

Visit https://logrocket.com/signup/ to get an app ID

Install LogRocket via npm or script tag. LogRocket.init() must be called client-side, not server-side

Stop guessing about your digital experience with LogRocket

Learn how to animate transitions in Angular apps

While animations may not always be the most exciting aspect for us developers, they’re essential to keep users engaged. In […]

Understanding env variables and containers in Astro 4.10

Astro, renowned for its developer-friendly experience and focus on performance, has recently released a new version, 4.10. This version introduces […]

Build an image editor with Fabric.js v6

In web development projects, developers typically create user interface elements with standard DOM elements. Sometimes, web developers need to create […]

Creating toast notifications using Solid Toast

Toast notifications are messages that appear on the screen to provide feedback to users. When users interact with the user […]

2 Replies to "When will Safari finally get it together?"

Safari might be a safe and fast browser yet it is not a user friendly. PDF documents are not displayed in a readable format. Due to which I had to install a different browser to access my documents. Hoping that it may come to the normal working form very soon.

I do agree but I think the last release does now actually show that time and effort is needed for safari.

This page requires JavaScript.

Please turn on JavaScript in your browser and refresh the page to view its content.

Using App Router

Features available in /app

Progressive Web Applications (PWA)

Progressive Web Applications (PWAs) offer the reach and accessibility of web applications combined with the features and user experience of native mobile apps. With Next.js, you can create PWAs that provide a seamless, app-like experience across all platforms without the need for multiple codebases or app store approvals.

PWAs allow you to:

Deploy updates instantly without waiting for app store approval
Create cross-platform applications with a single codebase
Provide native-like features such as home screen installation and push notifications

Creating a PWA with Next.js

1. creating the web app manifest.

Next.js provides built-in support for creating a web app manifest using the App Router. You can create either a static or dynamic manifest file:

For example, create a app/manifest.ts or app/manifest.json file:

This file should contain information about the name, icons, and how it should be displayed as an icon on the user's device. This will allow users to install your PWA on their home screen, providing a native app-like experience.

You can use tools like favicon generators to create the different icon sets and place the generated files in your public/ folder.

2. Implementing Web Push Notifications

Web Push Notifications are supported with all modern browsers, including:

iOS 16.4+ for applications installed to the home screen
Safari 16 for macOS 13 or later
Chromium based browsers

This makes PWAs a viable alternative to native apps. Notably, you can trigger install prompts without needing offline support.

Web Push Notifications allow you to re-engage users even when they're not actively using your app. Here's how to implement them in a Next.js application:

First, let's create the main page component in app/page.tsx . We'll break it down into smaller parts for better understanding. First, we’ll add some of the imports and utilities we’ll need. It’s okay that the referenced Server Actions do not yet exist:

Let’s now add a component to manage subscribing, unsubscribing, and sending push notifications.

Finally, let’s create a component to show a message for iOS devices to instruct them to install to their home screen, and only show this if the app is already installed.

Now, let’s create the Server Actions which this file calls.

3. Implementing Server Actions

Create a new file to contain your actions at app/actions.ts . This file will handle creating subscriptions, deleting subscriptions, and sending notifications.

Sending a notification will be handled by our service worker, created in step 5.

In a production environment, you would want to store the subscription in a database for persistence across server restarts and to manage multiple users' subscriptions.

4. Generating VAPID Keys

To use the Web Push API, you need to generate VAPID keys.

Create a script file, e.g., generate-vapid-keys.js :

Run this script with Node.js to generate your VAPID keys:

Copy the output and paste it into your .env file.

5. Creating a Service Worker

Create a public/sw.js file for your service worker:

This service worker supports custom images and notifications. It handles incoming push events and notification clicks.

You can set custom icons for notifications using the icon and badge properties.
The vibrate pattern can be adjusted to create custom vibration alerts on supported devices.
Additional data can be attached to the notification using the data property.

Remember to test your service worker thoroughly to ensure it behaves as expected across different devices and browsers. Also, make sure to update the 'https://your-website.com' link in the notificationclick event listener to the appropriate URL for your application.

6. Adding to Home Screen

The InstallPrompt component defined in step 2 shows a message for iOS devices to instruct them to install to their home screen.

To ensure your application can be installed to a mobile home screen, you must have:

A valid web app manifest (created in step 1)
The website served over HTTPS

Modern browsers will automatically show an installation prompt to users when these criteria are met. You can provide a custom installation button with beforeinstallprompt , however, we do not recommend this as it is not cross browser and platform (does not work on Safari iOS).

7. Testing Locally

To ensure you can view notifications locally, ensure that:

Use next dev --experimental-https for testing
When prompted locally, accept permissions to use notifications
Ensure notifications are not disabled globally for the entire browser
If you are still not seeing notifications, try using another browser to debug

8. Securing your application

Security is a crucial aspect of any web application, especially for PWAs. Next.js allows you to configure security headers using the next.config.js file. For example:

Let’s go over each of these options:

X-Content-Type-Options: nosniff : Prevents MIME type sniffing, reducing the risk of malicious file uploads.
X-Frame-Options: DENY : Protects against clickjacking attacks by preventing your site from being embedded in iframes.
Referrer-Policy: strict-origin-when-cross-origin : Controls how much referrer information is included with requests, balancing security and functionality.
Content-Type: application/javascript; charset=utf-8 : Ensures the service worker is interpreted correctly as JavaScript.
Cache-Control: no-cache, no-store, must-revalidate : Prevents caching of the service worker, ensuring users always get the latest version.
Content-Security-Policy: default-src 'self'; script-src 'self' : Implements a strict Content Security Policy for the service worker, only allowing scripts from the same origin.

Learn more about defining Content Security Policies with Next.js.

Exploring PWA Capabilities : PWAs can leverage various web APIs to provide advanced functionality. Consider exploring features like background sync, periodic background sync, or the File System Access API to enhance your application. For inspiration and up-to-date information on PWA capabilities, you can refer to resources like What PWA Can Do Today .
Static Exports: If your application requires not running a server, and instead using a static export of files, you can update the Next.js configuration to enable this change. Learn more in the Next.js Static Export documentation . However, you will need to move from Server Actions to calling an external API, as well as moving your defined headers to your proxy.
Offline Support : To provide offline functionality, one option is Serwist with Next.js. You can find an example of how to integrate Serwist with Next.js in their documentation . Note: this plugin currently requires webpack configuration.
Security Considerations : Ensure that your service worker is properly secured. This includes using HTTPS, validating the source of push messages, and implementing proper error handling.
User Experience : Consider implementing progressive enhancement techniques to ensure your app works well even when certain PWA features are not supported by the user's browser.

manifest.json

Was this helpful?

How to Use Progressive Web Apps on iPhone in iOS 17

If you no longer want unnecessary apps to gobble up a ton of storage uselessly, I would recommend you start using Progressive Web Apps on your iPhone. They are lightweight and come with all basic features. Better still, just like normal apps, PWAs can work offline and even send notifications to keep you updated about the latest happenings.

The whole point is you don’t need to install every app that you wish to use on your iOS device. That said, keep reading to learn how to use Progressive Web Apps on iPhone.

More About Progressive Web Apps and Why They Matter

Before moving ahead, let’s have a clear understanding of Progressive Web Apps and how they work!

For folks who are uninitiated, Progressive Web Apps are basically bookmarks that you can put on your Home Screen for quick access. While simple bookmarks do not work offline, PWAs are accessible even when you don’t have an internet connection. Thus, you can the apps offline without any interruptions whatsoever.

Couple that with the ability to access some important features like geolocation, Apple pay, camera, and PWAs become more than capable to offer a decent app-like experience.

Talking about the downsides, PWAs can’t store more than 50MB of offline data in your device. Besides, they don’t have access to the hardware features like Face ID/Touch ID and Bluetooth which prevent them from offering a more personalized experience.

Add Your Favorite Progressive Web App on Your iPhone Home Screen

Adding a web app to the Home Screen on iOS is a breeze.

To get going, launch Safari on iPhone.
After that, go to the website that offers PWA. Some of the most popular progressive web apps are Google Maps, Instagram, Flipboard, and Twitter Lite.
Then, tap on the action or the share icon at the bottom of the screen and select Add to Home Stream in the share sheet.

Choose Add to Home Screen in Share Sheet

Now, you can give a more suitable name like Instagram PWA to your web app.
In the end, make sure to tap on Add at the top right corner of the screen to complete the process.

That’s done! Your web app will now appear right on the Home screen, thereby allowing you to access the site with just a click on the app icon.

Turn On Push Notifications for PWAs on iPhone

For a more personalized experience, you should enable notifications for your favorite web apps.

Just launch the web app on your iPhone -> look for the option to turn on the toggle for Push Notifications or hit Allow in a notification prompt. Be sure to confirm the action, if asked.

Enable push notifications for PWAs on iPhone and iPad

If you want to fully customize the notifications for your web app, head into the Settings app on your device – > Notifications -> choose your web app. Then, you can fine-tune the notifications to your liking.

Customize PWA notifications on iPhone and iPad

Get the Most Out of Web Apps on Your iPhone

That’s all about using PWAs on iPhone. Gone were the times when web apps used to be mere bookmarks. Now, they have got the basic tools to let you use websites with complete peace of mind.

Agreed, there are some restrictions but they don’t seem to be dealbreakers for me. What about you? Feel free to share your invaluable thoughts via the comments section below.

Ratnesh Kumar

Ratnesh Kumar is an experienced tech writer with over six years of experience. All this years he has written at TechYorker, BrowserToUse, Fossbytes, MakeTechEasier, SysProbs and several other publications. When not writing, he likes to listen Punjabi music or watch Cricket match.

How to Lock Your iPhone with Back Tap in iOS 18

Launch Your Favorite Siri Shortcut from the iPhone Lock Screen

How to Add a Siri Shortcut to Your iPhone Lock Screen in iOS 18

Fix Pink screen of death on iPhone featured

How to Fix Pink Screen of Death on iPhone

Fix ACPI BIOS Error on Windows 11 featured

How to Fix Error Code 0xc0000221 on Windows 11

How to Install a Progressive Web Application (PWA)

What is a pwa, installing a pwa on ios, installing a pwa on android, installing a pwa on a windows pc or mac.

A progressive web application (PWA) is a web site that can be downloaded to your device and used like an app. The NIOSH Hearing Loss Simulator is an example of a PWA. While a PWA can be used like any regular web page, installing it can provide some advantages. An installed PWA can still be used without an internet connection. It will also appear alongside your other apps for convenient access.

The installation process varies depending on your operating system and web browser.

A PWA can only be installed on iOS using the Safari web browser. First, navigate to the site in Safari. Press the "Share" button and select "Add to Home Screen" from the popup. Lastly, tap "Add" in the top right corner to finish installing the PWA. It will now be on your home screen.

Screenshots of the iOS PWA installation process.

The default Chrome browser is capable of installing PWAs for Android. First, navigate to the site in Chrome. Press the "three dot" icon in the upper right to open the menu. Select "Add to Home screen." Press the "Add" button in the popup. The PWA is now installed and available on your home screen.

Screenshots of the Android PWA installation process.

Google Chrome and Microsoft Edge currently have the best support for PWAs on Windows and Mac OS. The installation process is very similar for both browsers. First, navigate to the site you wish to install as a PWA. If the site is a PWA, there will be an icon on the right side of the URL bar. Click the icon then click the "Install" button. Alternatively, you can install the PWA from the "three dot" menu.

On a Windows PC, the PWA will be available in the start menu. On a Mac, the PWA will be in the launcher and in the spotlight search.

Microsoft Edge

Google Chrome

Workplace Safety & Health Topics
Publications and Products

Customize your iPhone in more ways than ever, stay connected with friends and family, and relive your favorite moments. And with Apple Intelligence, the things you do every day become even more magical.

Available September 16th Available 9.16

Apple Intelligence

On all iPhone 16 models, iPhone 15 Pro, and iPhone 15 Pro Max, iOS 18 introduces Apple Intelligence, which draws on your personal context to give you intelligence that’s most helpful and relevant for you.

Coming in beta this fall *

Writing, focus, and communication.

New Writing Tools and language capabilities help you write, summarize longer text, and prioritize notifications.

Delightful images created just for you.

Create images to express yourself, craft Genmoji for conversations, or revisit favorite moments with your own memory movies.

The start of a new era for Siri.

With richer language understanding and awareness of your personal context, Siri is more capable and helpful than ever.

Customization

Rearrange apps and widgets.

Personalize your Home Screen layout.

Place your apps and widgets right where you want them. Arrange them along the bottom for quicker reach, or off to the side to frame a favorite wallpaper. Or give each page of your Home Screen a unique layout that’s most helpful for you.

New look for app icons

App icons and widgets appear even sleeker with a new Dark look. Tint them all with any color, or have iOS suggest a color that complements your wallpaper. You can also make apps and widgets appear larger.

Locked and hidden apps

Two new ways to protect sensitive apps and the information inside them when others are using your device.

Lock an app to require Face ID, Touch ID, or your passcode for access. Information from the app won’t appear in other places across the system, including search and notifications, so others don’t inadvertently see sensitive information. And just as easily hide an app to move it into a hidden apps folder that’s locked.

A big update to Control Center

The redesigned Control Center features new groups of controls, which you can access more fluidly with a single, continuous swipe down on the Home Screen.

Controls gallery

Add more controls from the Controls gallery, which displays all your options in one place, including new controls from your favorite apps.

Rearrange and resize your controls

Customize how your controls are laid out, resize them, or build your own groups of controls so they’re always just a swipe away.

Controls on your Lock Screen

Swap out your Lock Screen controls.

Swap out the controls at the bottom of the Lock Screen for something else — like taking a note when an idea strikes or quickly capturing the moment for your social media. You can even use the Action button on all iPhone 16 models and iPhone 15 Pro to access these new controls.

Biggest redesign ever

Your entire library. Organized just for you.

The new Photos app keeps your library organized and makes it supereasy to find photos fast. Its gorgeous yet familiar look puts everything you want right at your fingertips, so you can spend less time searching and more time enjoying your memories.

Browse by helpful topics

Collections automatically organizes your library by theme, so you can check out your recent days, people and pets, trips, and more.

Customize Photos exactly how you like

Reorder Collections and choose items to keep at your fingertips in Pinned Collections, so you can quickly get to the content you care about most, whether that’s photos of your dog or your friends, photos you’ve recently edited, or even screenshots or receipts.

All-new ways to play with text

In addition to bold, italics, underline, and strikethrough, you can apply playful, animated effects to any letter, word, phrase, or emoji in iMessage — many of which are automatically suggested as you type.

Whether you want to emphasize some major news, bring your emoji to life, or you’re just blown away, text effects give you new ways to visually amplify your texts. Some words and phrases automatically display a suggestion, and you can also add one of the many new effects to any text.

Tapback with any emoji or sticker

Express yourself in more ways than ever.

Now you can send a Tapback with any emoji or sticker, including Live Stickers made from your own photos and stickers from your favorite sticker packs. Quickly access the ones you and your friends use the most with just a swipe.

Messages via satellite

Stay connected when you’re without Wi-Fi or cellular.

With the satellite capabilities on iPhone 14 or later, you can stay connected with friends and family over iMessage or SMS even without cellular or Wi-Fi service. When texting people on iMessage, you’ll also be able to use key features like sending and receiving messages, emoji, and Tapbacks. And all your iMessages sent over satellite are end-to-end encrypted. 1

Schedule a message with Send Later

Whether it’s too late at night or too important to forget, you can now schedule a message to send at a specified time.

Support for RCS messaging

RCS (Rich Communication Services) messages bring richer media and delivery and read receipts for those who don’t use iMessage.

Categorization

Have it all sorted out for you. 2

On-device categorization organizes your messages and helps you stay up to date across all your accounts. The Primary category includes your most essential emails — like those from people you know and time-sensitive messages. And the rest of your email will be organized into new categories like Transactions for receipts and order confirmations, Promotions for marketing and sales messages, and Updates for newsletters and everything else.

Get right to what matters most

The Primary category helps you focus on what matters most, like time-sensitive messages and emails from friends, family, or colleagues.

Messages grouped for scanning

View snippets of messages like receipts, marketing emails, and newsletters grouped by sender.

Introducing Highlights

Safari will automatically detect relevant information on a page and highlight it as you browse. Highlights display helpful information like directions and quick links to learn more about people, music, movies, and TV shows. 3

A smarter, redesigned Reader

With a table of contents and high-level summary, get the gist of an article before reading on. 4

Passwords app

All your credentials in one place.

From passwords to verifications and security alerts, find them all securely stored in the Passwords app.

Backed by secure end-to-end encryption and seamless syncing, the Passwords app safely stores all your credentials. It lets you filter and sort accounts by recently created, credential type, or whether an account is in a shared group, to quickly find accounts you’re looking for.

Securely synced across devices and apps

Works across iPhone, iPad, Mac, Apple Vision Pro, and Windows.

Access the Passwords app on iPhone, iPad, Mac, and Apple Vision Pro, and on Windows with the iCloud for Windows app. All the passwords sync securely across your devices, and if you use AutoFill, your passwords will automatically be added to the Passwords app.

Topographic maps and trail networks

Download the lay of the land. 5

Maps now features topographic maps with detailed trail networks and hikes, including all 63 U.S. national parks. Save maps to your device to access offline with turn-by-turn voice guidance, or create your own hikes.

Save hikes for offline access

Browse thousands of hikes that you can save to your device — along with any notes you want to add. 6

Custom walking and hiking routes

Create your own routes.

Create and save custom walking and hiking routes with just a few taps. Choose different route options, including “one way,” “out and back,“ or a loop.

Game Mode

Maximize gameplay performance.

Game Mode minimizes background activity to sustain consistently high frame rates for hours of continuous gameplay.

More responsive AirPods and controllers

Game Mode dramatically reduces audio latency with AirPods, and makes wireless game controllers incredibly responsive. 7

Game Mode improves in-game responsiveness by doubling the Bluetooth polling rate with wireless controllers, giving you an edge you can feel right away. It also reduces audio latency when using AirPods. 7 And Personalized Spatial Audio is enabling game developers to create an immersive soundstage, putting players in the middle of the action like never before. 8

Introducing Tap to Cash

Bring iPhone devices together to pay privately. 9

Whether you’re at a garage sale or paying someone back for dinner, Tap to Cash makes in-person payments quick and easy without having to share phone numbers or email addresses. Securely authenticate with Face ID, Touch ID, or passcode, then bring your devices together to send Apple Cash.

Rewards and installments in Apple Pay

Pay using rewards or pay in installments. 10

View your rewards or points balance in Wallet and redeem points with Apple Pay online and in apps. You can also easily access installment financing options from your bank.

Event tickets and new event guides

Redesigned event tickets bring new features, including an event guide combining helpful information about the venue with recommendations from Apple apps. 11

Hands-free Siri Interactions

Say yes with a nod, or no with a shake.

With Siri Interactions on AirPods Pro 2, you’ll have the ability to simply nod your head yes or gently shake your head no to respond to Siri. 12 So if you’re on the bus to work or at home while the baby is sleeping, you can keep Siri working in the background without having to speak out loud.

Voice Isolation on AirPods Pro

Sound crystal clear on calls, even in windy conditions or areas with loud background noise, through advanced computational audio.

Personalized Spatial Audio for gaming

The same immersive experience that has transformed music and movies puts you right in the middle of the action of your favorite games. 8

Game developers are already using the new API to bring this experience to games with advanced sound design — like Need for Speed: Mobile by Tencent Games and EA coming this fall. In addition, voice quality improvements for in-game chat and streaming deliver 16-bit, 48kHz audio and support for dynamic head tracking. 7 And AirPods Pro now deliver our best wireless audio latency ever for mobile gaming, giving you even more of an edge. 7

Live audio transcription

Record audio sessions within your note and generate live audio transcriptions you can search through or combine with other comments, checklists, or documents. 13

Crunch numbers right in your note

Enter an expression and have it solved instantly while typing. 14

Collapsible sections

Simplify and hide text with collapsible section headers, making it easy to manage your most text-heavy notes.

Highlighting

Make text stand out with color.

With the new highlight style feature, it’s easier to quickly mark up your notes and make text stand out.

Journaling for wellbeing

Log your state of mind in the Journal app. You can also automatically add the time you spent journaling as mindful minutes in the Health app.

Track goals with Insights view

View your writing streaks, a calendar with existing entries, and other fun stats to stay on top of your journaling goals.

Sort and search past entries

Easily find past entries with the ability to sort your journal and use Search to find exactly what you’re looking for.

Home Screen or Lock Screen widgets

Add widgets for writing prompts or streaks.

It’s even easier to reflect on the present moment. Add a widget to your Home Screen or Lock Screen with writing prompts that change throughout the day. Or add a widget to track your current streak.

Apple TV app

A new way to watch apple original content.

Select InSight in the Apple TV app to learn more about the actors and music as it all plays out onscreen. 15 InSight will also be available when using iPhone as a remote control for Apple TV 4K, perfect for when you’re watching with others.

Stream Severance on the Apple TV app with a subscription.

Enhance Dialogue on iPhone

Tune in to the whole conversation.

Enhance Dialogue helps you better hear what’s being said onscreen, especially when loud sound effects or music is playing. It’s now available on recent iPhone and iPad models when playing through the built-in speakers, wired headphones, AirPods, or other Bluetooth-connected speakers and headphones. 16 Enhance Dialogue applies machine learning and computational audio to deliver incredible vocal clarity by actively detecting speech across audio channels. So now even whispers are heard more clearly amid the music and background sounds of your favorite movies and shows.

Grant specific controls with guest access

Guest access helps you manage how and when people can enter your home, providing access to the garage openers, alarm systems, and door locks you select, at the times you choose. 17

Hands-free unlock

Magically unlock doors as you approach, simply by carrying iPhone in a bag or pocket or wearing Apple Watch. 18

Robot vacuum cleaner support

Ask Siri to clean the floors.

The Home app now supports the core functionality of robot vacuum cleaners, such as power control, cleaning mode, vacuum, mop, and charge status. They can also participate in automations and scenes, and respond to Siri requests. So you can add them to your cleaning routines — or tell Siri to do some spot cleaning in the living room.

View your home electricity use

Easily access and understand your home electricity usage right from the Home app. Eligible Pacific Gas and Electric Company customers can connect their utility account to view their electricity usage and rate plan information. 19

Privacy and Security

Control how you share contacts with apps.

Decide which contacts to share with an app, rather than giving it access to all your contacts. Or give the app access only to those you message and call most.

Redesigned Privacy and Security settings

An improved Privacy and Security settings menu makes it easier to manage how much information you’re sharing with apps.

Improved Bluetooth privacy

Pair accessories with greater privacy.

App developers will be able to offer an intuitive new way to pair accessories while protecting information about your nearby Bluetooth devices.

And so much more.

Accessibility..

Eye Tracking makes it possible for people to control iPhone with just their eyes. 20 Music Haptics syncs the iPhone Taptic Engine with the rhythm of songs so those who are deaf or hard of hearing can enjoy the Apple Music catalog. 21 And Vocal Shortcuts helps people with severe atypical speech record sounds that trigger specific actions on iPhone.

Calculator.

Access the all-new Math Notes calculator, a new portrait orientation for the scientific calculator, and other new features like unit conversion and history.

A redesigned month view makes it easier to get an overview of your month ahead. And you can create, view, edit, and complete reminders from the Reminders app right in Calendar.

Scenes let you organize and present your board section by section. Send a copy of your board to anyone with just a link. An improved diagramming mode makes it easier to form connections on your canvas. And align your board content just the way you like by snapping items to the grid.

With enhanced screen sharing capabilities, you can draw on someone’s screen so they can see what they can do on theirs, or control their screen and take actions yourself.

Emergency SOS live video.

Share streaming video and recorded media during emergency calls. During a call, participating emergency dispatchers will send you a request to share live video or photos over a secure connection, making it easier and faster to get the help you need.

Apple Fitness+.

A new design lets you jump right into a personalized selection of workouts or meditations. The For You tab elevates activities based on preferred trainers, durations, and music. And an all-new search feature makes it easy to find exactly what you love.

Record and transcribe a live call directly from the Phone app. 22 You can also search call history more easily, dial smarter, and switch SIM cards seamlessly.

iOS 18 is compatible with these devices.

Learn more about iPhone

iPhone 16 Plus
iPhone 16 Pro
iPhone 16 Pro Max
iPhone 15 Plus
iPhone 15 Pro
iPhone 15 Pro Max
iPhone 14 Plus
iPhone 14 Pro
iPhone 14 Pro Max
iPhone 13 mini
iPhone 13 Pro
iPhone 13 Pro Max
iPhone 12 mini
iPhone 12 Pro
iPhone 12 Pro Max
iPhone 11 Pro
iPhone 11 Pro Max
iPhone X S Max
iPhone SE (2nd generation or later)

Developers will love iOS 18, too.

Learn more about developing for iOS

アプリケーション・ビルダー・ユーザーズ・ガイド
アプリケーションのグローバリゼーションの管理
APEXにより内部使用されるメッセージの翻訳
翻訳が必要なプログレッシブWebアプリケーション(PWA)メッセージ

Safari Hostel Moscow

Petrovka St., 26/8, Moscow, Russia

Safari Hostel

Featuring recreational facilities and a game area for a restful stay, Safari Hostel is located in the Tverskoy district, a 6-minute walk from Monument to Fallen Police Officers. If you need to keep in touch with the outside world, this hostel provides Wi-Fi throughout the property.

GUM is also situated a 5-minute drive away. The hostel enjoys a prime location 10 minutes by car from Gorky Central Park of Culture and Leisure.

Safari Hostel has 8 rooms equipped with ironing facilities, as well as media amenities such as a personal computer. To enhance guest convenience, hair dryers and bath sheets are provided in the bathrooms.

Ceretto seafood restaurant is located approximately 5 minutes on foot from this property. Guests can make use of coffee and tea making facilities provided in the hostel. Kitchen also provides a microwave, a refrigerator, and kitchenware. Tsvetnoy Bulvar underground station is a 5-minute walk away, while Sretenka bus stop is a few minutes' drive from this property.

Maximum period that can be booked is 30 days. Please enter alternative dates.

Rooms & Availability

Electric kettle
Cookware/ Kitchen utensils

Room Amenities

Tea and coffee facilities
Dining table
Ironing facilities
Washing machine
In-room computer

Important information

Children and extra beds
There are no extra beds provided in a room.
There are no cots provided in a room.

Route Planner

Enter your starting point (at least street address and city) to receive driving directions to the hotel.

Driving Directions
Public Transport
Walking Directions
Local attractions
Bolshoi Theatre 650 m
Stoleshnikov Lane 450 m
Church of St. Nicholas the Wonderworker 450 m
Moscow Museum of Modern Art 300 m
Church of St. Sergius of Radonezh in Krapivniki 150 m
The Grave of Laziness and Creative Block 400 m
Neglinnaya Gallery Mall 250 m
The State Literary Museum 200 m
The Temple of the Sign Icon of Mother of God 450 m
Sheremetyevo International 30 km
Train stations
Leningradsky Train Station 2.7 km

Please, select dates to see available rooms.

Checking available rooms

Searching rooms…

Checking available hotels

Searching hotels…

Write a review

Your details

Your impression of the property, how to reach hotel, top hotels in moscow near safari hostel.

Moscow, the capital and most populous city of Russia, is truly a must-visit destination. The city is known for its stunning architecture, jaw-dropping landmarks such as the Red Square and Saint Basil's Cathedral, and vibrant nightlife. Walk around iconic neighborhoods like Kitay-Gorod and immerse yourself in the city's bustling and energetic vibes. Be sure to check out the stunning museums like the Tretyakov Gallery, The Pushkin State Museum of Fine Arts, and the Moscow Metro station, which is famous for its magnificent and ornate architecture. Don't forget to try some authentic Russian cuisine and visit the city's famous markets. In Moscow, there is an endless list of sights and activities for tourists to enjoy.

To make the most of your stay, check out our list of the best hotels in the city.

4-star hotels

The 20 Best Places to stay around the world in 2024 based on travellers' reviews

Travellers' Choice Best Places to stay are determined based on the quality and quantity of traveller reviews and ratings specific to each subcategory posted on our site from January 1, 2023 through December 31, 2023.

Find your perfect place to stay!

Great locations and deals for every budget.

Safari Hostel, Russia

Palouse Women Artists

A community of artists on the Palouse

Upcoming Shows & Events

Upcoming pwa show.

Our next group show will be at the Valley Arts Center , 842 6th St., Clarkston, WA during September of 2024. Opening: Thursday, September 12, 2024, 4:00-7:00pm (date changed).

Collaborative Artwork at Bookpeople, Moscow, ID

Art piece: 20+ pieces that go together and resemble book shelves with many books

Current Shows Featuring PWA Members

Polly Walker has an art exhibit coming up on September 6th, 2024 at the Lucidity Gallery (800 Main St. #6 in Lewiston, ID. The Artist’s reception is 5:00-8:00pm on September 6th. Please drop by if you can. ( Facebook page for event )
We have a couple of members who have spaces at the Artisan Barn , Uniontown, WA (check the barn’s website to see their schedule).
We also have members displaying and selling their work at the Moscow Farmers Market as well as the Moscow Winter Market.

Next Regular Meeting – Sunday, September 15th

Our next regular meeting is September 15th, from 3:00-5:00 pm at the 1912 Center, 412 E Third Street, Moscow (in the Art Room on the 2nd Floor). We recommend masks if you are compromised and ask that all who participate are vaccinated for Covid. Membership dues are $20 ($7.50 for students) and are due by December. You must pay dues if you want to participate in PWA group shows. We welcome college students to join our group and participate in our shows!

Drawing Circles, Small Gatherings & Retreats

There are a number of small art creation gatherings and drawing circles happening weekly (and during the summer). We also have a winter and summer retreat. Please send an email to [email protected] to learn more about joining our group and attending events.

In the News

Our group was recently featured in a Spokesman Review article .

COMMENTS

Installing and uninstalling web apps
The "Add to homes screen" user interface installs the PWA on Safari on iOS. Other browsers, including Chrome for Android, include the app installation command in the browser setting menu. In Chrome and Edge on desktop, when the user navigates to the page, if the page is a PWA and the PWA is not currently installed by the browser, an ...
PWA on iOS
Learn how Progressive Web Apps (PWAs) on iOS have evolved and what features and challenges they face in 2024. Find out about home screen addition, dark mode, motion sensor API, iPadOS distinctions, and more.
Safari 17 Beta: A Game Changer for PWAs on MacOS
Learn how Safari 17 Beta supports Web Share API Level 2, Web App Manifest, Web App Banner, Service Workers, and Web Push API for Progressive Web Apps (PWAs). PWAs are web applications that offer a native app-like experience to users and can work offline, send push notifications, and access device features.
Progressive Web Apps
A Progressive Web App (PWA) is a web app that uses progressive enhancement to provide users with a more reliable experience, uses new capabilities to provide a more integrated experience, and can be installed. ... macOS, and Safari. While Apple has never used the term PWA in public, they've been supporting the technologies to make a PWA ...
PWAs Turn Websites Into Apps: Here's How
Safari doesn't use the terms install and app, like all other browsers that support PWAs do. To install one on iOS or iPadOS, load the PWA-capable site, choose the Share up-arrow at the bottom of ...
Installation
When users use the PWA, they are not using an instance of the Safari app (like they use an instance of Chrome when doing so), they are using something known as Web.app, so you should expect slight differences between your PWA rendered in Safari and a PWA window. Both Safari and Web.app use the same core from WebKit and the same JavaScript ...
Making PWAs installable
The PWA can be installed like a platform-specific app, and can customize the install process. Once installed, the PWA gets an app icon on the device, alongside platform-specific apps. Once installed, the PWA can be launched as a standalone app, rather than a website in a browser. We'll discuss each of these features in this guide.
Web Apps on macOS Sonoma got a proper install experience
The pwa-install component aims to improve the install process for PWAs, with the most recent update making the experience feel more native for Safari users on the new macOS Sonoma. Whether you're aiming to reach macOS, iOS, or wider audiences, this component can play for you a vital role in creating a seamless PWA installation experience.
Progressive Web Apps (PWA) on iOS 13 & 14, iPhone & iPad
Learn how to create and use progressive web apps (PWA) on iOS devices with Safari browser. Find out the limitations, benefits and tips for PWA on iOS 13 and 14.
Progressive Web Apps on iOS are here
The PWA can run inside Safari as any website or in standalone mode, like any other app in the system. If you are wondering if PWAs are using the Web View, that's not the case from Safari or the ...
When will Safari finally get it together?
Safari's PWA support has improved with this release, and declaring icons in the web app manifest is finally supported. The service worker navigationPreload is a welcome addition that can decrease startup time by allowing network requests to happen in parallel with serviceworker startup. Unfortunately, there is still only experimental support ...
Does Mac Safari(16.1) support PWA to add
But I still couldn't find it. Is there anyone know if Mac Safari (16.1) support to add web page to home screen currently? Many thanks. he means progressive web app (PWA) and basically it is the ability to install a web app to your desktop. It then effectively acts like a standalone app with better functionality and integration. Try Squoosh.app ...
With iOS 17.4 beta in the EU, no browser can install PWA apps, even Safari
Previously, only Safari was able to install and run PWA apps. With iOS 17.4 beta in the EU, no browser can install PWA apps, even Safari. It seems PWAs have been disabled entirely. Oh yes, when you set a third-party browser as the default browser and then you delete it, iOS sets Safari as the default browser.". twitter.com Open.
Sending web push notifications in web apps and browsers
To enable push notifications, follow this general approach in your webpage or web app: Ask the user for permission to send them push notifications. Provide a method for the user to grant permission with a gesture, such as clicking or tapping a button. When the user completes the gesture, call the push subscription method immediately from the ...
Do Safari extensions work in PWA's for iOS 16 or 17 beta? : r/PWA
I've found that Adguard is more capable in Safari than in Safari webapps (e.g. ads are blocked on example.com in Safari but not example.com if it is installed as a Safari PWA ('add to homescreen'). Can anyone tell me whether extensions work in Safari webapps for iOS 16/17? The ad blocker I use (Ka-Block!) works fine in installed PWAs, both on ...
Configuring: Progressive Web Applications (PWA)
Exploring PWA Capabilities: PWAs can leverage various web APIs to provide advanced functionality. Consider exploring features like background sync, periodic background sync, or the File System Access API to enhance your application. For inspiration and up-to-date information on PWA capabilities, you can refer to resources like What PWA Can Do ...
Storage Limits for PWAs in iOS Safari (2021)?
From personal experience we have found that storing the data in indexeddb (IDB) on a pinned PWA seems to be more persistent. Apparently it also depends on available space on the device as well however I haven't found a concrete list of rules that iOS safari uses to clear the data. We found IDB on iOS to be unstable and it would silently ...
Progressive web apps(PWAs) are coming to a Safari near you
Safari/Webkit has finally started adding features that constitute a PWA. Before we proceed its important for us to understand what features constitute a PWA. At the core of it only three
How to Use Progressive Web Apps on iPhone in iOS 17
To get going, launch Safari on iPhone. After that, go to the website that offers PWA. Some of the most popular progressive web apps are Google Maps, Instagram, Flipboard, and Twitter Lite. Then, tap on the action or the share icon at the bottom of the screen and select Add to Home Stream in the share sheet. In the end, make sure to tap on Add ...
How to Install a Progressive Web Application (PWA)
An installed PWA can still be used without an internet connection. It will also appear alongside your other apps for convenient access. The installation process varies depending on your operating system and web browser. Installing a PWA on iOS. A PWA can only be installed on iOS using the Safari web browser. First, navigate to the site in Safari.
iOS 18
Safari will automatically detect relevant information on a page and highlight it as you browse. Highlights display helpful information like directions and quick links to learn more about people, music, movies, and TV shows. 3. A smarter, redesigned Reader.
翻訳が必要なプログレッシブWebアプリケーション(PWA)メッセージ
翻訳が必要なプログレッシブWebアプリケーション(PWA)メッセージをリストします。
THE 5 BEST Moscow Safaris (Updated 2024)
Aviashop.Ru. 7. Transsib Moscow. 8. BASK TOUR. Top Moscow Safaris: See reviews and photos of Safaris in Moscow, Russia on Tripadvisor.
Safari Hostel
123 reviews. #9 of 812 hostels in Moscow. Location. Cleanliness. Service. Value. Safari Hostel is perfectly located the heart of Moscow - 5 minutes walking from the Kremlin, Red Square, Bolshoy Theatre and many other famous sightseeing. A lot of cafes, restaurants, bars are in the neighborhood as well as the several stations of metro and other ...
Safari Hostel Moscow
Safari Hostel has 8 rooms equipped with ironing facilities, as well as media amenities such as a personal computer. To enhance guest convenience, hair dryers and bath sheets are provided in the bathrooms. Ceretto seafood restaurant is located approximately 5 minutes on foot from this property. Guests can make use of coffee and tea making ...
Upcoming Shows & Events
PWA collaboration that is now on display at BookPeople in Moscow, ID (was originally at the 1912 Center in Moscow, Idaho as part of "PWA Presents" show in January of 2024) Current Shows Featuring PWA Members. Polly Walker has an art exhibit coming up on September 6th, 2024 at the Lucidity Gallery (800 Main St. #6 in Lewiston, ID. The Artist ...