Progressive Web Apps: the real deal

It is no surprise that traditional retail is experiencing a slow-down, but eCommerce is up. Additionally, shoppers continue to gravitate toward mobile shopping over desktop, with two out of three online shopping dollars spent on mobile.

For eCommerce merchants, this means it’s imperative that the online shopping experience on both desktop and mobile is optimized for conversions, user experience, and the fast-changing eCommerce environment.

The solution: A Progressive Web App, or PWA.

What is a PWA?

A progressive web app (PWA) combines the best of eCommerce websites and native mobile apps. PWAs are built using web technologies like Javascript, HTML, and CSS, and as such, function as a mobile website viewed through a browser yet look and feel like a native mobile app.

Think about well-known mobile native apps such as Instagram or Facebook that allow a user to switch between pages seamlessly with millisecond page load speeds and are built primarily for the mobile user. Though PWAs are not native mobile apps, they have similar functionality and benefits.

PWAs are also “progressive.” In other words: PWAs will work on any mobile device (no matter how old it is.) However, when a device is more advanced, PWAs will take advantage of those newer features and provide an updated experience accordingly.

Why should you consider a PWA for your store?

PWAs come with built-in benefits for the consumer and the merchant. Let’s look at some of the biggest advantages.

Provides the benefits of a native mobile app without installation

The one key difference between a PWA and a native app: PWAs don’t have to be installed. This means customers get the benefits of a native app without the fuss of installation.

Though PWAs are accessed simply by visiting a merchant’s website on a mobile browser, they also have the ability to be added onto a customer’s home screen as an icon to look like a native mobile app. In addition, this icon enables push notifications as a native app does. Clicking on a PWA icon takes the consumer directly to a merchant’s mobile-friendly web experience, which often feels similar to the experience inside a native app.

Costs less for merchants to launch

Crucially, PWAs can be built one time and used for iOS, Android, and browsers. Traditionally, merchants have to build one app for iOS, a different app for Android, and a separate mobile-friendly website.

The “one size fits all” of PWAs makes for a huge difference when it comes to cost and maintenance. Building a single native app can cost merchants up to $500,000... and you’ll still need to build a separate website as well. In contrast, a PWA can cost a fraction of this and functions as an app and desktop and mobile-friendly websites.

Not dependent on App stores

If desired, PWAs can be added to customers’ home screens instantly from their browsers. Native apps, on the other hand, require a much longer process. The customer must go to the app store, search for the app, install the app, and finally set it up before using it. This lengthy process negatively impacts conversions. One study found that every step before an app can be used loses up to 20% of people.

Additionally, PWAs don’t require merchants to apply to be included in an app store. The application process can take a significant period of time, postponing the launch date.

Doesn’t require manual updates

The benefit of not requiring manual updates is twofold: 1) Because PWAs are progressive, customers don’t have to update their phone software to be able to use them, and 2) PWAs update automatically, so customers don’t have to manually update each PWA on their home screen like they would a native app.

Bottom line: Native apps require updates, which puts more burdens on customers to take action. PWAs require little to no effort on the part of the consumer.

Uses less storage and data than native Apps

Because PWAs don’t have to be downloaded and installed onto a device to be used, they use far less storage on a mobile device, making it less likely a customer will delete the app to conserve storage space.

In addition, PWAs use considerably less data than a native app to be added to a device. As a result, customers will be able to add a PWA to their device without worrying about data usage.

SEO-friendly

Unlike native apps, PWAs are discoverable on search engines. This means that your PWA can be optimized for search engines, and all inbound links count toward building domain authority. PWAs also have a URL, unlike native apps. This means that PWAs can be used for link-building efforts, which further improves domain authority and ranking position in search engines.

Safe with HTTPS

Like secure websites, PWAs are hosted over HTTPS. This means that sensitive customer data like credit card numbers cannot be intercepted. Both merchants and customers can feel more secure with the online shopping experience.

Easily shared

Because PWAs have a URL, customers can share the link with friends. Those friends can immediately use it within the browser or they can add the PWA to their home screen, no installation process required. Plus, PWAs function no matter the make of your device so they can be shared between iOS and Android users.

Successful PWAs in the wild

How have PWAs helped eCommerce stores improve key metrics and reach their customers with ease? Here are a few examples of successful PWAs in the wild.

Something Navy handles large spikes in traffic

Before launching as an independent fashion line in 2020, Something Navy, partnered with Nordstrom as the retailer’s first influencer private-label brand. At this time, the brand had gained so much popularity that it crashed the Nordstrom site within an hour of the first collection drop due to high traffic volumes. After Something Navy crashed Nordstrom’s site on four separate occasions, the brand decided to launch their own eCommerce store. This time they needed a website that could handle large spikes in traffic to provide the best experience for their followers.

By partnering with Nacelle and building a PWA, Something Navy now has a website equipped to handle any amount of traffic, including over 100,000 unique sessions in 30 minutes and selling $1 million of clothes in 30 minutes. Something Navy’s entire PWA loads in 1.4 seconds and the page-to-page load speed is just 34 milliseconds.

Trivago increased engagement by 150%

When Trivago launched their PWA, online engagement increased by 150%. And more than 500,000 people added it to their home screens.

On the consumer side, the PWA Trivago experience feels similar to an app. Once added to your home screen, the familiar Trivago logo becomes the icon, and it’s a quick click to be taken to the mobile-friendly vacation search engine.

Starbucks doubled its daily users

Starbucks used a PWA to supplement a native app because the company found that many customers weren’t taking the time to install it.

So, they launched a PWA tailored specifically for mobile orders. It’s separate from their main website, and it’s designed to facilitate ordering on the go. Starbucks’ PWA functions just like a native app would, without the hassle of installation. As a result, Starbucks doubled its daily users.

Ballsy Improved its Conversion Rate by 28%

Ballsy, a skincare company for men, was growing fast and aiming to scale even more. Therefore, the Ballsy team installed several cutting-edge apps and widgets to help them test strategies and improve their conversion rate.

Unfortunately, all those tools slowed down their load time to a whopping 15.8 seconds--damaging their conversion rate in the process. To become more nimble, Ballsy decided to launch a PWA with Nacelle. As a result, their load time decreased to just one second, and their conversion rate increased by 28%.

How Nacelle can power your PWA

Nacelle provides a storefront template PWA that makes it easy to integrate with your backend and makes frontend content changes quicker than ever.

Let’s take a closer look at how this works to your advantage.

1. Open-source JavaScript Framework to Save Time and Lower Costs

Nacelle PWAs use modern JavaScript frameworks like Vue and React. This means web developers who are versed in Vue or React can build an exceptional mobile experience without having to learn a new, native app language (like Swift, Objective C, Java, or C++.) and merchants are not required to hire a separate native app developer. This saves merchants months of work and upfront costs.

2. Decoupled Frontend and Backend for Low Latency

With Nacelle, the PWA is separate from the backend (a headless build). The PWA and backend instead communicate via APIs for uber-low latency and fast response times. This means that the user experience is not bogged down by backend operations and can load more quickly.

3. Statically Generated Homepages for Large Traffic Volumes

Static generation enables your PWA to handle large spikes in traffic without slowing down page load speeds. With static generation, when a mobile phone requests the website from the server, it renders the pre-built homepage without having to re-process it. This makes the PWA more secure and faster to load, which is crucial for capitalizing on traffic spikes.

4. eCommerce Platform & App Integrations for Ease of Transition

When you build a PWA with Nacelle, it’s easy to integrate your Shopify backend without a data transition or migration. You can also integrate with over 30 popular eCommerce apps like Yotpo and Klaviyo. Merchants can keep using their tech stack to optimize the customer experience while making an easy transition to a PWA storefront.

5. Single Page Application for Native App Functionality

Nacelle PWAs use single page application to load the storefront all at once--and only one time. This means that when a customer clicks from page to page, there is no extra load time because the store doesn’t have to hit a backend server every page change. As a result, the customer experiences the PWA just like a native app.

Nacelle’s solutions can deliver the initial page load in about one second and page changes in about 30 milliseconds.

6. Static Hosting Platform and CMS Integration for Customization

Nacelle’s PWA solutions offer a fully hosted version and are designed to integrate with static hosting platforms, like Netlify and Vercel, and content management systems like Contentful. This allows merchants to choose the backend and frontend combination they prefer.

PWAs: Combine the Best of Native Apps and Traditional eCommerce Websites

Launching a PWA means merchants can provide customers with the benefits of shopping in a native app but customers won’t experience the hassle involved with installing a native app.

Moreover, PWAs give merchants the advantages of a traditional website. Merchants can improve SEO and expect to spend far less than they would on building a native app.

For these reasons, a PWA is the best solution for merchants who are focused on mobile traffic and conversion rate optimization but don’t want to divert resources to building a native app from scratch. Nacelle makes it even easier to build your PWA with a storefront template and managed backend infrastructure that’s customizable.

If you think a PWA is the right solution for your store, request a Nacelle demo today.