Progressive Web Apps on iOS

Generally Progressive Web Apps only work on Android devices because they are an invention from Google. But with some tricks it will be possible to get nearly the same behaviour on an iOS device. You don't know what Progressive Web Apps are? You can learn the fundamentals in this Lightning Talk.

Missing App Manifest support

The Safari doesn't understand any App Manifest file. Hence there will be no alert to install the app on the device. But Safari offers a button to add your website to the home screen. So it is possible to create an own alert box using HTML which is only shown on iOS. This way the alert box can already be shown on the first visit. It may show a short instruction to the user how to add the website to the home screen using the share button on iOS.

Missing Service Worker support

Also Service Worker API is not supported by Safari. But it is possible to use the older Application Cache API. The solution would be to implement a switch: Use the shiny new Storage API of Service Worker on Android and implement a fallback to the old Application Cache API on iOS. If you use Webpack to manage your JavaScript files, this plugin "offline-plugin" does all the work for you.

Conclusion

The missing support of Safari for the App Manifest file and the Service Worker can be replaced by the compromise solution described above. Let us start building cool and shiny Progressive Web Apps in the future!