Why All Retailers Need to Be Aware of PWAs

January 2, 2018

By: Peter Sheldon,
Author Title: 
Head of Strategy
, Magento Commerce

Originally posted on Total Retail.

The buzz around progressive web apps (PWAs) has been building since designer Frances Berriman and Google Chrome engineer Alex Russell coined the term back in 2015. These mobile apps that progressively load and run in a web browser promise to blur the lines between native apps and the mobile web by bringing (almost) all the advantages of native mobile apps to the mobile browser. Companies are already seeing promising results after launching PWAs, and it’s time that all retailers across geographies and industries begin paying attention to the next big mobile evolution since responsive web design.

PWAs Solve 2 Problems At Once

To understand why PWAs are important we must take a closer look at the state of the mobile web today. According to Forrester and Shop.org, average conversion rates on native mobile apps are 6 percent, on desktop 4.2 percent, while the mobile web lags behind at only 2.3 percent.

What we can conclude from these numbers is that well-designed and well-built native mobile apps (think Amazon.com's) offer such a fantastic and frictionless shopping experience that they provide a superior digital shopping experience to the venerable desktop. The problem, however, is that mobile apps are one, very expensive to build and maintain and two, consumers only download and use apps from brands with which they have regular interactions. Native apps, therefore, are great for enterprise organizations with seven-figure mobile development budgets, mature loyalty programs, or customers that engage and purchase multiple times a month. For the average merchant, however, a native app strategy rarely makes commercial sense.

This is where PWAs play their trump card: the ability to deliver blazingly fast and slick “app-like” experiences in the mobile web browser using open web technologies. It's an intriguing proposition for online merchants faced with an existential shift of traffic from desktop to mobile devices. PWAs promise to solve two problems at once: they offer improved performance and usability, and thus promise to have a big impact on mobile web conversion rates while also alleviating the need for merchants to invest in developing expensive native apps.

PWAs Are Built With Open Web Technologies

It’s key to remember that PWAs are an evolution of open web technologies. The technological difference between a PWA and existing responsive web design (RWD) is that PWAs are built 100 percent using JavaScript, HTML and CSS. The secret behind PWAs lies in a new set of APIs that have been recently added into web browsers themselves called “Service Workers.” Service Workers allow JavaScript to run in the background of the PWA and process important functions such as predictively pre-loading content, sending push notifications, and synchronizing and receiving data.

What’s the catch? While there have been some concerns about ubiquitous browser support, SEO rankings and support on desktop, these perceived drawbacks are quickly being addressed, which means that PWAs are:

  • SEO friendly: PWAs aren't like conventional sites as the pages progressively adapt as the user navigates and performs actions. Essentially, pages rarely reload, hence the URL stays constant. Luckily, all the major search engines have mechanisms of crawling the JavaScript of a PWA site just as they would a conventional responsive site. The key is maintaining good SEO practices such as using canonical URLs and maintaining a crawlable sitemap.

  • Desktop friendly: PWAs aren't exclusively for the mobile web. In fact, desktop browsers support Service Workers too, which is important as PWAs can and should be developed responsively to support varying screen sizes across mobile, tablet and desktop.

  • Coming to Safari: Apple recently announced that development for support of Service Workers on the Webkit engine (on which Safari is based) has started, so in the near future PWAs will work not only on Android phones and desktop browsers such as Chrome, Firefox, and Opera, but on iOS phones and MacBooks too.

Ultimately, PWAs mean more mobile visitors, usage, and conversions.

Why PWAs Will Be Preferred by Consumers

With PWAs, mobile web users now get to experience:

  • Faster browsing: PWAs are much faster to interact with as well as provide smoother scrolling and transitioning of pages as the experience “progressively” changes thus removing the need for pages to “reload.” Early adopters such as AliExpress have seen 100 percent jump in conversion rates since making the switch. Google even provides a testing tool (Lighthouse) so you can benchmark your PWA's performance.

  • Instant "app" gratification: PWAs are instantly discoverable and usable via the browser, thus eliminating the need to download or install an app before use.

  • Push notifications: An exciting proposition for online marketers is that PWAs support push notifications in the browser, extending the opportunity for marketers to send real-time, contextual and personalized communications with a simple “one click” opt-in directly from the PWA site.

  • Offline usability: PWAs can detect the state of the mobile network and thus developers can design them to be tolerant of poor network conditions. For example, a PWA may proactively pre-fetch catalog content to ensure an uninterrupted and usable product discovery experience during those 60 seconds when the commuter train enters a tunnel.

  • Rapid re-engagement: Just like a native app, a PWA can be “saved” to the home screen (on Android devices), allowing for rapid repeat access without the need to open the browser and type in a URL. Furthermore, PWAs operate in “full-screen” mode, hiding the browser URL bar on the top and the browser navigation tools on the bottom for a native “app-like” look and feel.

Next Steps for Businesses

PWAs represent a seismic advancement in the web, similar in magnitude to the transition that happened five years ago from conventional desktop sites to RWD sites. Here are some immediate steps you can take to get your organization prepared:

  • Take a PWA experience test drive. PWAs are real and I encourage you to try some of the early trailblazer sites like wego.comhousing.comaliexpress.com and Twitter Lite on a Chrome browser.

  • Get your front-end development teams engaged. There are tons of literature and developer guides out there for your development team to begin researching, including Google’s PWA site and this DevBlog post from Magento Lead Front End Architect James Zetlen.

  • Start budget planning for 2018. As 2017 draws to a close, I encourage commerce leaders to make sure that PWAs are on your 2018 roadmap. Furthermore, start planning for a migration from your current RWD site to PWAs next year to be ahead of the curve and get a head start on the competition.

The emergence of PWAs isn't a small change and it will take time to make this migration. All businesses must investigate PWAs—their bottom lines count on it in our increasingly mobile world.