What are Magento Progressive Web Apps?
As a Magento developer, I’m always open to the newest tools available.
A lot of them are as confusing as they are interesting, so today I want to take a look at one that I feel is becoming more useful and appealing: Magento’s Progressive Web Application (PWA) platform.
While this product is still in the R&D phase, (hence being labeled as a ‘project’) it is worth exploring and going over the two basic implementation types for Magento PWAs.
A Definition of Progressive Web Apps
First, let’s get the technical part out of the way. Let’s break down the name ‘Progressive Web Application’:
Progressive means that the application loads along with any relevant data and assets, as a user navigates around your website. This results in an end-user experience with better speed, usability, offline operation and device integration.
Web means that it’s written in the languages of the web (HTML, CSS, JavaScript). This allows you to create a site that gives more app-like functionality without creating a native app restricted to one platform, such as iOS or Android.
Application means it installs and runs code on the shopper’s device or computer. Doing this creates more speed and capability than the single-page JavaScript apps of the past.
PWAs are essentially a hybrid of regular web pages and the mobile app, allowing for mobile app-like experiences for the web. This is important because mobile web searches on Google have surpassed desktop, and users are spending an increasing amount of time inside mobile apps. In some cases, 90% of monthly usage is now inside an app of some type.
PWAs are part of the developer toolkit
The term “Progressive Web Application” itself was invented by Google. However, Google doesn’t have any intellectual property ownership over PWAs they are now just another part of the developer’s toolkit.
From a developer point of view, Progressive Web Applications are the future of eCommerce. PWAs are not just the latest fad in Web apps; they represent the current best practices for making any website useful and profitable.
In fact, I can see a future where PWAs may become as mandatory for a good website as responsive design is today. Let’s dive a little deeper into why.
What are the benefits of Progressive Web Apps?
In my experience as a developer, Progressive Web Apps for Magento websites, there are two key benefits:
1) Speed
In developer terms, the nemesis is latency. Latency is what causes websites to slow and sales to dip. A developers goal is to find ways to speed up and make the experience as smooth as possible. On average, it takes most web pages with responsive web design (RWD) about 6 -18 seconds to load. Research has shown that from approximately 40% of people will abandon a web page that takes more than three seconds to load. With PWA latency is one-tenth of RWD. This means to customers these pages will appear to load and function instantly.
2) Conversions
The goal of eCommerce sites is to convert visitors to their website into completed sales. Many factors contribute to low conversions and high cart abandonment.
Mobile sites that embrace PWA together dramatically improve conversions. While the industry average, including sites using RWD, is 0.25% – 0.75%, sites using PWA enjoy conversion rates 50 – 100% higher than the industry average. This is because the buyer has no real perception of the difference, but the website functions smoothly both online and offline.
Exploring Magento + PWAs
To finish up, we should probably cover the two basic implementation types for PWAs with Magento.
1) Front-end with PWA Support
If your website has a front end, PWAs can add a great deal of functionality. Think about an app on a phone that works in flight mode. This is what the PWA does for the Magento website. Companies such as MeanBee (recently acquired by Space48) are pushing forward this development of this type of PWA support.
2) PWAs as Frontend
Essentially these are plugins that remove the need for direct Magento front-end connectivity. They do the heavy lifting after a single site visit and offer a more seamless experience. Another feature that is appealing is that PWA’s can benefit from push notifications just like native apps.
Three worth checking out are:
- Deity
- Vue Storefront
- Magento’s PWA Project
Currently, Magento-Research is creating a developer kit to allow you to build a PWA to replace the frontend of Magento and use a headless instance of Magento as the backend.
A new way to solve old problems
Progressive Web Applications act in the same way as mobile apps do. They offer a more stable user experience during poor network connectivity due to pre-cached assets or access to an “offline” page. From my perspective as a Magento developer, integrating PWAs into your Magento site offers some serious advantages:
- Faster, more secure user experience
- Better SEO rankings
- Better usability
- Better performance
- Offline access
- Mobile install
- Cross-browser compatibility
And it seems a lot of very successful business agree. During the past two years, we have seen examples of companies embracing PWAs: Alibaba, Fandango, Twitter and The Washington Post to name just a few.
For me, Magento Progressive Web Apps are an exciting way to solve some significant problems many eCommerce businesses have. They are worth exploring as the space evolves and develops.
