As technology develops, so do the needs of users. The answers are new solutions that keep appearing and promising a fantastic user experience. When mobile devices gained more importance (which is constantly growing), this field had to be taken more seriously. Hence, so many types of mobile applications businesses want to provide their consumers with software for these devices to choose from. It is a crucial business step – currently, a massive loss is the lack of investment in mobile solutions, from website optimisation to advanced mobile applications. The choice depends on the requirements of the recipients. PWA is an increasingly common choice. No wonder it is very beneficial for both users and companies. It does not require development for each platform separately, so it is a cost-effective approach. In turn, users will surely appreciate the speed of operation.
However, PWAs for iOS are quite a big challenge. Unfortunately, Apple does not make it possible to add all the attractive features that could entice consumers. So, is it profitable to develop PWAs when your primary target audience is iPhone users? Which companies decided to create PWA? What is the functionality of such a solution? Let’s take a closer look at this matter.
PWA – introduction
The type of application hidden under the PWA (Progressive Web Apps) abbreviation is software delivered by the web. Actually, it is a kind of website with some additional functionalities. The technologies used to create them are popular web building tools, including JavaScript, HTML and CSS. This means that JS frameworks are also great at developing PWA. Progressive web applications are designed to run on any platform that uses a standards-compliant browser, including mobile and desktop devices. Since 2021, PWAs are supported to varying degrees by Google Chrome, Apple Safari, Firefox for Android, and Microsoft Edge. Due to their web nature, they are cross-platform software. As with other such solutions, they aim to make it easier for developers to build cross-platform applications compared to native applications. Moreover, they do not require distribution in app stores. However, it is possible and sometimes makes sense from a business point of view.
The essential technical criteria for a website to be considered a progressive web application, as described by one of Google’s PWA engineers, Alex Russell, are:
- Must come from a secure source – they must be supported by TLS displays and green padlocks (no mixed content active) and over HTTPS to ensure security, content authenticity and user privacy.
- Must load offline – PWAs require Service Workers to create programmable content caches. To guess when the content is no longer needed, programmable caches can explicitly fetch the content in advance of using it for the first time and explicitly discard it when it is no longer needed. Thanks to this, it is possible to access websites offline or in low-quality networks.
- Must address the Web App Manifest – due to the existence of the manifest, PWA applications can be easily hosted via a URL detected by the search engine and do not require complicated installation. The manifest must contain at least five fundamental properties:
- name
- short_name
- start_url
- display with a value of standalone or fullscreen
- An icon at least 144×144 large in png format.
Examples of PWAs on iOS
This popular social media, famous for its political skirmishes, cutbacks, and Elon Musk’s revelations, launched its PWA in 2017. User statistics mainly drove the company’s decision – as many as 80% of them used Twitter on mobile devices. The creators decided to provide a better user experience and more engaging access with less data consumption. PWA was, therefore, a great solution, especially for users with a weaker Internet connection. It made Twitter see a significant increase in the number of pages per session and tweets sent.
Starbucks
It is a flagship example of using PWA with success. Starbucks launched its PWA in the same year as Twitter. Again, it was supposed to be a lightweight, quick solution for consumers to make it easier for them to browse the coffee shop chain’s offerings. In addition, Starbucks PWA allows you to check the menu and nutrition information and manage your orders, also offline. Since the launch of PWA, Starbucks has experienced a twofold increase in daily active users.
Trivago
The well-known travel application that searches for the best hotel room prices has significantly increased user engagement thanks to PWA. Trivago also has a native application, but it is twice as popular. PWA is lighter, also works offline, and sends push notifications. It also does not take up as much space on the device as a native app.
The source of inspiration for many users, Pinterest, until PWA’s release complained about the relatively slow performance of the site. Progressive Web App has definitely changed that – the app is more efficient and requires little space for data. As a result, the company recorded significant increases in user engagement, conversions, and ad revenue.
Forbes
Yet another brand that, seeing the trend of most users switching to mobile devices, decided to improve this experience. PWA won with the mobile website due to its loading speed and other features. In addition, Forbes PWA significantly increased engagement and the number of sessions per user. A design reminiscent of Instagram or Snapchat Stories additionally attracts users. Increased ad visibility and increased traffic have certainly earned Forbes a significant income.
How do I add PWA to the App Store?
Apple is famous for having the strictest application rules that can be found in the App Store. Using many arguments, including insufficient user experience, too little “resemblance” for the application, or the lack of a real consumer need, Apple does not allow PWA to be published in its store. So it would help if you considered your primary goal before you decide to go with PWA. If you want to reach iOS users, evaluate the advantages and disadvantages of PWA compared to native applications. Perhaps, however, Apple’s efforts to hinder the existence of PWA on their devices will be a big enough challenge to decide on PWA. However, if you have a PWA, you still have the option to reach iOS users. Apple still allows iOS Safari to open and save PWAs on the home screen. Your PWA will be accessible from the home screen like all other apps, but with some limitations like a 50MB buffering limit, no Siri, Bluetooth, Touch and Face ID access, no push notifications, and more. So, if iOS users are critical to your business, consider creating a native app as well.
How do you make a PWA for iOS?
Progressive Web Apps and Apple have a bit of a love-hate relationship. On the one hand, it was the founder of Apple, Steve Jobs, who announced the concept of PWA to the world, although without a defined name yet. However, at that point, the idea did not take over properly. Finally, after a few years, Google described PWA, which has become a standard and even a trend in software development. On the other hand, for years, Apple seemed to be very indifferent to PWA. Recently, however, it has made some improvements and offers gradually increasing support for this type of application.
In the case of iOS, the Safari browser takes care of PWA. Besides, PWA is a cross-platform solution, so it does not have to be developed separately for Apple devices. So it is developed like a standard PWA. So you need to create a website and add a few PWA-specific elements to it. So you need to create an application manifest and add it to the base HTML template. It is also essential to implement the Service Workers service. These are client-side JavaScript files that listen for and respond to events. One of the most commonly handled events is the download event, which can cache web content offline.
Does iOS support PWA push notifications?
Currently, there is no official support for push notifications from Apple yet. On developer portals, however, there are several ways that developers can get around the system a bit. According to a thread on stackoverflow.com, those methods require the application ID to be registered in the Apple Developer Portal with the consent of the relevant service. There is also a way to use Apple Wallet for this purpose. Unfortunately, these are not easy methods, and they really belong to the functionality that we would expect from PWA. Perhaps in the future, Apple will enable the implementation of push notifications in a simple, official manner announced by them. Many Apple and PWA supporters are waiting for this moment.
iOS Progressive Web App Cache Capacity
A Service Worker cache limit imposed by Safari is 50 MB.
Service Workers enable websites to work offline using the Cache API. Therefore, PWA developers need to design meaningful caching logic. Unfortunately, the limit set by Apple does not make it easier for developers to work. However, there is a method that allows it to be bent. Use IndexedDB (IDB), which is an unstructured data store such as MongoDB. The indexed DB limit for iOS Safari is up to 500 MB. The IDB is, therefore, a fallback place to store more data.
Future of PWA on iOS
Apple is quite reluctant to PWAs. It seems to add more and more possibilities for them gradually, but nonetheless, the functions are still minimal. The significant disadvantage is the lack of sending push notifications or at least launching them officially without complicated methods not authorised by Apple. In addition, it is surprising due to the initiation of the PWA idea by Steve Jobs. It seems that the current owners and decision-makers in the company do not care too much. So what can we expect in the future? Probably, however, more possibilities for PWA on iOS devices. This is a powerful trend that Apple will eventually yield to. It’s hard to say on what scale it will be possible to use PWA on iOS in the coming years, but hopefully, you will finally be able to do it freely.
January 25, 2022
