Building progressive apps
For The Next Billion Internet Users
As a Google Developer Expert working in Africa, I work at the coalface of tech for emerging markets, and one of the web tech developments for this market that I am most excited about is Progressive Web Apps or PWAs.
By Johann du Toit
For a long time now the distribution of online content and services between the developing and developed world was shockingly unequal, but now we have a chance at making all of that more fair, especially if you consider that the biggest predicted growth markets for the internet in the next decade are mass market consumers in the emerging economies.
Global research tells us that there is a massive upward trend in mobile internet usage that is unlikely to slow down anytime soon. There are already 5 billion unique mobile subscribers in the world and 8.1 billion mobile connections including M2M, according to GSMA Intelligence. The next billion internet users, according to big players like Google, will come mainly from emerging economies. And this is precisely where all the conditions that native apps need, to work optimally, don’t always exist. So regular native apps just aren’t cutting it anymore.
The trouble with native apps in emerging markets are that they need to be installed from the Google Play or Apple App stores and are very data-heavy. They are expensive to install and to use in areas of patchy or non-existent connectivity, especially in countries that are typically monopolised by over-priced mobile networks. Consider India, where one hour of minimum wage work gets you only 15 downloaded web pages. They also don’t work on all phones.
Launching a PWA instead, on the other hand, is the most efficient and cost-effective way to ensure reach on all platforms and form factors — you need just one app that can work everywhere straight from the browser; not separate apps for separate operating systems, browsers or models of phones. Google back in 2010 famously said that looking into the future, the web was the platform with the widest reach on all form factors and the least amount of friction for all users, and if you look at the figures today this is still true. It is now estimated that the mobile web’s reach is three times greater than that of mobile apps and this figure is likely to increase in the future.
The beauty of PWAs is that they are normally only a few hundred kilobytes big and on top of that the content is cached, which means it is still there to view the second time around, whether the user is online or offline.
User engagement is one area where native apps have trumped browsers in the past, but PWAs are now levelling the playing field. Having a PWA that sends push notifications allows you to implement clever engagement strategies, like those of the popular Hook Model, to encourage habitual engagement from audiences, something that wasn’t possible with traditional web apps but that were key differentiators for native apps.
PWAs are game-changers because they can be launched from a device’s home screen, installed right there from the browser, remain updated all the time automatically and then offer a complete full-screen experience. That circumvents the app store experience which can be cumbersome and expensive in emerging markets. Thanks to recent developments and the popularity of the web, you can now build an app that enables communication with bluetooth devices from the browser, talking to USB devices directly from your website code, the capture and modification of photos or videos in realtime from the camera or source, and the detection of shapes, faces or even barcodes.
Those are plenty of good reasons to build PWAs for these markets, but there is another big plus. Search engines treat PWAs like red carpet rockstars. For instance, a PWA is likely to come up as a top search result in Google — or certainly higher up than a competitor that doesn’t have a PWA — and will be immediately installable to the user’s home screen right there in the search results.
Twitter is one of the big players that recognised this opportunity and made a deliberate play at gaining momentum in emerging markets by going the PWA route. If you install the Twitter native app it will consume 114MB of data — a fortune for minimum wage earners in developing countries. That’s why Twitter announced in April that it would launch Twitter Lite, in collaboration with Google, a PWA of merely 1MB that has all the features of the native app including a timeline feed, direct messages, offline support and push notifications. It’s reportedly 30% faster and consumes up to 70% less data than the native app.
Compare that to Facebook whose native app consumes 216MB to install, and who also launched a lite version two years ago to address this issue. It’s a lite Android app, not a PWA. Perhaps they were too early to market to jump on the PWA train. Facebook Lite is very low on bandwidth but doesn’t have as much functionality as a PWA would have had, so one hopes in a year or two they’ll have a PWA too to give data-strapped users everywhere an even better experience.
One of the great success stories of PWAs in emerging markets is that of Jumia, a leading e-commerce and e-travel site in Africa. Some of the staggering statistics they recently shared include that they now boast a 33% higher conversion rate and 50% lower bounce rate, they have 12 time more users versus native apps (on Android & iOS), their visitors use five times less data and need 25 times less device storage to run its PWA. And it’s built to be offline-first. The Jumia Travel PWA uses 80% less data than the native app to complete the first transaction and consumes 25 times less storage. All of this is very beneficial for their users considering that Jumia’s main market is sub-Saharan Africa where 75% of the mobile connections are on 2G networks, where many users only have intermittent connectivity and where most visit the site from low-end phones with data limitations.
PWAs are supported by all Android versions running Chrome/Firefox, so it works great on Samsung and older phones. And Android O, as announced at the recent Google IO 2017 conference, offers even deeper integrations. Apple iOS/Safari do not have all the features yet to support PWAs, but with the traction that PWAs are getting now I would expect it to get picked up in the next few months.
All PWAs are expected to have these following attributes before they can really be called PWAs:
Progressive because it can work across all forms of browsers
Responsive because it works on all screen sizes
Connectivity independent which means it can work on and offline
App-like in terms of behaviour, design look and feel
Fresh because it always pushes the freshest possible data
Safe because https and SSL certificates are now essential for all reputable websites
Discoverable which means it’s searchable in the browser
Re-engageable which means web app developers will now need to start thinking like mobile app developers in terms of hooking users with push notifications etc.
Installable which gives it an app-like feel right on the home screen
Linkable because any website can feature links to any page on your PWA
In my next tutorial, I will explain how to build a PWA and include a concise tutorial for web developers and app enthusiasts about the basic building blocks for PWAs.
The big players in the world are recognising the importance of building internet products and experiences that will be accessible to the whole world. Industry leaders such as Google, Mozilla and Microsoft are already working together to create a standard that will service both emerging markets and increase web engagement — it’s their big play for the next decade which paints you a pretty clear picture of the internet future we’re heading into. Smart, forward-thinking companies will be aligning their visions to this grand vision to stay relevant.
It’s not only a great commercial opportunity for all companies who market to the mass market — it’s also a moral imperative. Proper internet empowers economically. We can’t have a world where access to good online content is just for the privileged elite and we leave entire populations behind. I hope you’ll consider taking the PWA route — I believe strongly that it’s the way to go to welcome the next billion people to a more accessible internet.
About the author
Johann du Toit is the lead developer at Passmarked.com (a startup created by I|O Digital) in Cape Town and Africa’s first Google Developer Expert (GDE). Google flies him around the world to learn and teach things such as Google Design Sprints and other interesting topics to do with startups.
He regularly hosts meetups such as the I|O Powwow and Google Developer Group in Africa and leads Google Design Sprints for clients at I|O. He is the co-founder and lead developer of I|O-backed startup Passmarked.com, the world’s first comprehensive, open-source platform which tests how well sites work, based on the most up to date web standards.
THIS ARTICLE IS AN ADAPTATION OF A TALK DELIVERED AT THE MOST RECENT #IOPOWWOW IN CAPE TOWN.
IO Powwow meetups
IO hosts the popular #iopowwow tech meetup every last Friday of the month in Cape Town. The event covers tech topics that inspire curiosity and a yearning for learning, such as how to conduct an effective #NanoSprint (a methodology pioneered by IO) based on the Google Design Sprint methodology, how to get into #MachineLearning, and how to make games using Javascript. For more information about the IO Powwow meetups visit us on Medium.
