• Learn
  • Blog
  • Pricing
  • About
  • Sign in

Letter: Progressive Web Apps and our offline feature

Heath has noted that his app icon gains a Chrome overlay icon when installed to a user's home screen on Android. Our co-founder David explains that this issue will go away when we revise our offline feature.

Heath has spent more than 200 hours getting his engineering app just right. Some time ago, he noticed that an unwanted overlay icon has started to appear on Android when his app is installed to the user’s home screen:

An overlay icon shown on top of an app icon on Android

It appears that this overlay icon is only displayed on some app icons and not all. Specifically, it only appears on apps that use web technology and which don’t register a so-called service worker.

Apps built with Calcapp use an older technology to enable offline use, but we will offer a service worker implementation in the near future, which should fix Heath’s problem.

Here’s our co-founder David reply to Heath:

Hi Heath,

I’m glad Calcapp for the most part gets the work done for your business, thanks for your kind words.

It’s true that apps created with Calcapp don’t have a service worker. From Google’s point of view, that probably means that they don’t qualify as PWAs. We do use a manifest file (enabling an app title and app icon on the home screen) and we do use a mechanism enabling offline usage specific to PWAs (more on that later).

I tried installing the flipcart.com app to my home screen, and lo and behold, it has no Chrome overlay icon! That’s news to me – Google only added the icon fairly recently, and I wasn’t aware that they don’t do that for apps with service workers. Thanks for pointing that out!

Service workers perform a number of functions. Through service workers, apps can send push notifications when they’re in the background and synchronize data. Their primary purpose, though, is to enable apps to be used offline. An app can store some of its data for offline use and use a service worker to use those resources when the device is offline. It does so by running code on your device.

That part of the service worker specification makes an older specification obsolete called “application cache,” or Appcache for short. Appcache enables apps to specify what files should be available offline using a simple text file (here’s the Appcache file for our welcome app, if you’re curious). Appcache was superseded by service workers to give app developers more control (though we don’t actually need that).

Now, apps built with Calcapp run fine offline and they do so using Appcache. They use Appcache simply because we started building Calcapp in 2014, before service workers became available and Appcache was the only game in town. Apple only started supporting service workers in iOS this year.

Before Apple added support for service workers, we could have used Appcache for iOS and a service worker for Android, but there were very few benefits associated with going that route. (Before I learned of the icon overlay situation, the only benefit I was aware of was the “add to home screen?” banner displayed by Chrome, exclusively for PWAs with a service worker.)

Unfortunately, Apple’s implementation of service workers isn’t quite what we had hoped for. With Appcache, apps are essentially stored forever (until users manually clear the Safari cache). With service workers, iOS will automatically remove PWAs that haven’t been used “for some time,” making them second-class citizens compared to native apps.

In other words, Appcache remains superior to service workers in the sense that people won’t lose access to their installed apps. We can’t register a service worker and continue to use Appcache; it’s all or nothing. We probably need to accept this sorry state of affairs soon and move away from Appcache and register a service worker – after all, Appcache is marked as “deprecated” and support will be removed in the future from browsers and operating systems. (Here’s a post from our blog with more information.)

That’s a long-winded way of explaining that you will have your wish in the not-too-distant future, but it isn’t a simple fix, because it involves rewriting or at least revising Calcapp’s offline functionality.

(We’ve actually invested a lot of effort into offline usage. For instance, you can upload really high-resolution images and apps will pick the most appropriate image based on the characteristics of the device. For offline use, we only store medium-resolution images to prevent apps from consuming too much space. We also scan apps to see which fonts they use and make sure that the Appcache text file only references font files that are actually in use. Some of that work may have to be redone in a service worker context.)

/David

« A status report Bug report: Panel labels and app titles with spaces »