We are writing this blog after spending two thousand hours in PWA development. All PWA brings different challenges and we are sharing our experience here. We have faced a lot of issues while developing PWA applications for our clients from which many issues we had to resolve with other alternative approaches.
PWA has the ability to work on multiple platforms with the behavior of native app. This blog is more about PWA with the IOS platform as Apple is still lagging compared to other platforms. We will be sharing the challenges we faced while developing a dating app.
How we started the development of PWA for a dating application?
Our native mobile application team created a flawless dating app with all the required features which a dating app needed. All the development was done and it went through all the phases of testing. The client was very happy with the performance and end result of the app. And it became a sad day for him when Apple’s review team rejected the application due to nontechnical reasons. The client was confident about the concept and anyhow wanted to take the application to the market. Hence, we started the development of the same app as PWA.
Challenge 1: Social Login
Social Login is the first step in the dating app where we integrated Google login. Our PWA could not work with Google plugin as its open google login screen in the new browser tab and its redirect user on redirect URL in the same browser tab and not in the PWA.
To fix this issue we wrote our own code where we create a child window in PWA and open google’s login screen inside it. Once a user is authorized we took that data from google and closed the child window.
Challenge 2: QR Scanning
Our application has two user types of male and female and before they start the date, both users need to verify their presence at the decided place. And for that, we decided to use QR code where one user needs to scan other user’s code to confirm both users meet each other at the decided place. The camera feature is available in IOS PWA but unfortunately, the camera stream is not supported.
As an alternative we have implemented OTP based functionality. First we check whether the device supported camera stream or not? If it's allowed then we render the QR scanner and if the camera stream is not allowed in the device we render the OTP screen.
Challenge 3: Location (GPS)
In a dating app user location is the most important feature to show the nearest match. PWA has access to location service on devices and for that it will ask user permission. Everything works well if the PWA is allowed to access location service, issues will happen when the PWA is not allowed to use that service and as there is no other way to ask again to the user for location service access we got stuck.
To overcome this issue we have integrated third party API which give user location based on IP address. So first our PWA asks the user to allow permission for location service if the user allows then we read the user’s geolocation details from the device and if the user denied the permission then we use the 3rd party API to get the user’s geolocation.
Challenge 4: Push notification
Push notification is a very important functionality for any app. We need to use push notification to support chat functionality and it was also used to inform other users on each and every status change of their date like date requested, date accepted, date rejected etc.
Push notification is not working with IOS PWA as IOS is not supporting background processing.
So first we track the user device information in our system and we have implemented triggers for push notification that send notifications to android users and for IOS users we have written SMS triggers.
Other things
Few other normally overseen things that needs to be considered while developing a PWA that supports IOS devices.
IOS allows only 50 MB to PWA, so it's very important to plan app caching logic accordingly.
Background sync is also not allowed in IOS for PWAs, which a major drawback for any application.
Apple removed unused items (files) from disk if the PWA app is not used more than 15days(approx).
Summary
For Progressive Web Apps on iOS, there are certain limitations, but they aren't deal-breakers. Many of the features most requested have some form of a fallback solution, at least. It may not provide the native Web platform API or service offerings with comparable user experience.
For most mobile apps, particularly on iOS, there isn't a good channel for promoting and engaging your clients. For most applications, app installs are rare. The creation, management and promotion are also very costly for these applications.
Specifically, the web progressive web apps, are available on every device in every browser. And they can be sold through online channels, PPC and traditional marketing funnels at an affordable price.
Many brands, especially on iOS, have reported improved customer engagement stats after upgrading their websites to a PWA. Your brand will probably do so too
Top comments (6)
Hi, thank you for your very useful writing
I was researching about push notifications for IOS and it seems like push notification for IOS can be done through firebase and APNs
firebase.google.com/docs/cloud-mes...
I will be trying to make it work and write an article regarding the subject if it functions
Hey Mazen.. Thanks for read.
It will be great help to me and community, if you can share your findings on notification.
This is an excellent write-up not only of issues but of fallbacks and how to PROGRESSIVELY use technology. Well done.
'I'm glad that you like it',
It was my first try to write this kind of blog.
Some progress since this was authored. iOS 16 supports push notifications for web apps added to the home screen. developer.apple.com/documentation/...
Thanks Nishant,