Verj.io - The Executive's Guide to PWAs

The Executive’s Guide to Progressive Web Apps A high-level guide to the most important software trend for a decade

The Executive’s Guide to Progressive Web Apps 02 The web fights back Chances are, you probably don’t know much about progressive web apps yet. Or maybe you heard something but decided it’s more software hype that’s going to disappear just as soon as the next cool thing turns up. Either way, read on, because make no mistake, this time it’s different. PWAs are a game changer. Whatever you thought about mobile app development has just been turned on its head. In fact, the change is so fundamental that Gartner are predicting that by 2020 50% of all mobile apps will be PWAs. To put it simply, PWAs are the inevitable economic consequence of the massive, accelerating and unprecedented demand for mobile apps. Visit Verj.io for more information

The Executive’s Guide to Progressive Web Apps 03 Contents What’s been happening? ··························································································04 The problem with native apps ·················································································05 Enter PWAs ···············································································································07 App fatigue ················································································································09 PWAs vs the world ····································································································10 The Service Worker···································································································12 The future is progressive ··························································································13 How to get started?···································································································14 Visit Verj.io for more information

The Executive’s Guide to Progressive Web Apps 04 What’s been happening? Until just recently, the only way to deliver mobile apps with the right kind of cool, high-quality user experience was to use the native app development kits provided by the phone manufacturers. That’s right, native apps were the only show in town. Apps that ran in the phone’s browser just couldn’t compete. They were slower. They didn’t install nicely on the home screen. They couldn’t access the phone’s built-in features. They pretty much fell apart if you lost your Internet connection. In short, they just didn’t feel like they belonged on the phone. So, everyone built native apps. Millions of them. Visit Verj.io for more information

The Executive’s Guide to Progressive Web Apps 05 The problem with native apps So, what’s the problem? Native apps are expensive. Expensive to build You have to write complex low-level code that takes a lot of skill and experience, and worse, you need a different version of your app for each type of phone you want it to run on. At a minimum, that’s one version for Apple, one for Android and probably, yet another for users who need access from a web browser. Expensive to distribute Native apps have to be submitted to each different app store, there’s an approval process that can take days, and it’s by no means a given that your app won’t be re- jected for some reason. And then you need to do it all again for each new release. Visit Verj.io for more information

The Executive’s Guide to Progressive Web Apps 06 The problem with native apps Of course, once you’re through all the building and distributing it works beautifully. Your app can be discovered, rated and reviewed on the app store, the download and install process is easy and the result, when done well, is a smooth and engaging user experience. But the cost? Expensive Expensive is a relative term of course. So, expensive compared to what, exactly? Well, to deliver the same functionality using standard web technology like HTML, JavaScript and CSS is much, much cheaper. The skills levels are lower, you only need one code-base, and the whole app store distribution thing just disappears. Getting a web app to someone is as simple as sending them a URL. And better, because your app is served up by a web server your users are always running the latest version. Even though web apps are cheaper to deliver than native apps, no one’s been doing it. This is simply because until now the mobile browser user experience just hasn’t been good enough. Visit Verj.io for more information

The Executive’s Guide to Progressive Web Apps 07 Enter PWAs What are they? PWAs are basically web apps that deliver a user experience every bit as good as a native app. They’re installable like native apps, they support offline working, and they’re highly optimised to deliver the smooth, engaging user experience that everyone wants. All the upsides of a native app but a single code-base and the web’s ease of distribution. PWAs have been around since 2015. Their initial take-up was slow because Apple wouldn’t add PWA support to the Safari browser on the iPhone. And of course, creating a PWA that only ran properly on Android phones would have been completely pointless. This all changed though in March 2018 when Apple’s iOS 11.3 release included PWA support for Safari. At that moment the case for PWAs as a viable, cost effective alternative to native apps became compelling. Visit Verj.io for more information

The Executive’s Guide to Progressive Web Apps 08 Enter PWAs PWAs ask a very simple question Why would you develop a native app if a PWA can deliver the same user experience or better, but for a whole lot less time and money? Is it just about the money then? Well no, because the real measure of an app’s success is how well it engages its users. Are they using it? Do they like it? Not much point building an app your users don’t like using, they’ll just find a way not to. Limited functionality syndrome Because of the cost there’s a tendency to deliver native apps that are not much more than a functional tick in the box. Not the kind of high-quality experience that creates long-term user engagement and a serious return on your investment. This is one of the key reasons why a 1/3 of all Enterprise apps fail within 6 months. Visit Verj.io for more information

The Executive’s Guide to Progressive Web Apps 09 App fatigue Native... Recent surveys show that mobile users spend 85% of their time using just 5 apps, 41% are deliberately not downloading more apps, and about 70% of all app downloads drop out before completion. ...vs. PWAs E-commerce sites who’ve moved from native to PWA are reporting a 60% increase in sales conversions. Twitter’s PWA delivers the same experience as their native app but uses less than 3% of the device storage. This more efficient product has been a hit with users to the tune of a 20% decrease in bounce rate and 75% increase in sent tweets. What do these trends tell us? That people are tired of having to download and install resource hungry native apps. And then periodically do it all again to just to keep up with the latest version. There may well be “an app for that” but it doesn’t mean people will download it. The advantage of PWAs over native apps is they don’t need to be downloaded and installed. A user runs a PWA simply by clicking a URL, the PWA asks the user to “Add to Home Screen” and thereafter the app can be launched from an icon. The whole process takes just a few seconds and the running PWA is always at the latest version. Visit Verj.io for more information

The Executive’s Guide to Progressive Web Apps 10 PWAs vs the world What are the advantages? PWAs are normal web apps and can therefore be indexed by search engine bots. This makes them easily discoverable via the Internet. Like native apps PWAs can receive Push Notifications, an often-critical part of the user engagement process. PWAs also support offline working. This means that users can still interact with the app even when they’ve lost their Internet connection. PWAs can access phone features such as the camera, microphone, geolocation and screen orientation. Visit Verj.io for more information

The Executive’s Guide to Progressive Web Apps 11 PWAs vs the world PWA’s have much lower data usage than native apps and are designed to launch very quickly. A Doubleclick study by Google revealed that 53% of users will abandon an app if it doesn’t load within 3 seconds and that sites loading in under 5 seconds earned twice as much ad revenue as their slower counterparts. A very serious matter when you consider that the average native app takes around 19 seconds to load on a 3G network. Visit Verj.io for more information

The Executive’s Guide to Progressive Web Apps 12 The Service Worker PWAs have a Service Worker that runs on the mobile and acts as a kind of proxy between the browser and the web server. 1. The Service Worker has an offline cache that gets loaded in the background when the app first loads. 2. When the running app needs a file such as an image, it passes a request to the Service Worker, whose job it is to return that file to the calling app. 3. The Service Worker looks first in its offline cache and only passes a network request to the web server if it can’t find the file locally. Visit Verj.io for more information

The Executive’s Guide to Progressive Web Apps 13 The future is progressive This type of local caching enables PWAs to minimises network traffic delay and helps create a smooth and consistent user experience. Support for PWAs is also being added to desktop platforms like Windows 10 and Chrome OS. For example, Microsoft recently announced its intention to allow PWAs to be installed directly from their app store and show up in the start menu like any other installed program. Similarly, users visiting a PWA using the Google Chromebook will be prompted to add the app to their device, just like on an Android phone. Once added, the PWA will appear in the app drawer and open in a separate window. Visit Verj.io for more information

The Executive’s Guide to Progressive Web Apps 14 How do I get started? The Verj.io Low Code PaaS Verj.io is a Low Code platform that simplifies the development of rich, engaging PWAs. Developers build their app in the WYSWYG design studio, visually configure PWA features such as the web manifest, the Service Worker and the offline cache, and then 1-click deploy to the Verj.io Cloud for run-time operation. Building a high performance PWA from scratch using traditional web tools is a serious technical challenge. That’s why Verj.io makes best practice PWA settings the default, with no configuration required. Details such as bundle size, lazy loading and cache management are all handled automatically, leaving your developer free to concentrate on app functionality. Visit to start your Free Trial today Visit Verj.io for more information