A few years ago I started work on a webapp for iOS to report delays on Montreal’s Metro. On the front-end it was pretty crude, more of an experiment than anything else. But it developed into something myself and a few other people found useful.
My overall aim was to create something which behaved like a native app so far as was possible:
- It should have a correctly proportioned homescreen icon.
- It should launch in its own container, showing up in the iOS task switcher as a distinct app.
- It should have a splash screen.
- It should work off-line.
- It should be able to update itself when new versions are released.
All went well, and I ended up with a usable version I was happy with… under iOS 6.
Fast forward to today, and over subsequent iOS upgrades Apple has managed to break some of the functionality that allowed webapps to feel native. They still work, but they don’t feel right.
If you look around the web you realise others have become frustrated with the situation. Some of the current issues with webapps under iOS 10 include:
- Splash screens no longer work at all.
- People seem to have problems setting the colour of the status bar to match their design and getting it to behave correctly.
- Having multiple webapps open causes the OS to become confused between them.
There are plenty of support threads open on these issues on Apple’s site, not to mention elsewhere. And yet Apple is strangely silent on the issue. For example, their Safari Web Content Guide seems to be completely at odds on the issue of working splash screens, in-spite of having its last update in December 2016 at time of writing. Here’s what they say:
On iOS, similar to native applications, you can specify a launch screen image that is displayed while your web application launches. This is especially useful when your web application is offline. By default, a screenshot of the web application the last time it was launched is used. To set another startup image, add a link element to the webpage, as in:
<link rel="apple-touch-startup-image" href="/launch.png">
In the above example, replace launch.png with your startup screen filename. See the “Graphics” chapter of iOS Human Interface Guidelines for current launch screen sizes and recommendations.
This simply doesn’t work anymore, and hasn’t for quite a while.
It seems like these are small bugs which Apple could easily address, but they don’t. Either they don’t care about what they consider to be a piece of lesser used functionality, or they’re backhandedly trying to protect the app store by letting the situation fester. Remember when the iPhone came out and webapps were touted as the future?
It’s annoying to watch this technology end up stuck in a time warp, especially as Google and others now promote progressive web apps with access to many of the APIs that native apps enjoy.
So, what are the answers? Perhaps to focus on other platforms (eg: Android) for the full experience since they have a greater reach than iOS, and just have the iOS experience be acceptable with the current restrictions. Or, use a framework to wrap the app in a native container so it can be submitted to the app store. But at the end of the day, it feels to me like Apple are unnecessarily breaking an implicit API contract they held with a small pool of their developers, and that’s not cool.