MageDirect
eCommerce done right
previous post

Magento 2 Sales Page Extension

next post

Latest Technical articles about Magento 2

Progressive Web Apps for eCommerce with Vue Storefront

progressive web apps banner

Big updates go in Web Application Word! eCommerce will change in 2018 with the entry into the market of Progressive Web Apps (PWA), which are actively advertised by Google.

In this article, we will explain why business should invest in the development of PWA for its stores and what benefits they will receive.

What is PWA?

To put it simply, eCommerce Progressive web apps is a combination of web pages and native mobile apps. In this case, you do not need to install the application. It is enough to go to URL, as on a regular site, and the browser will save the user interface of the website into browser cache.

Then, with the following downloads, the user will open the PWA instantly, and only dynamic data will be synchronized with the server. The user can save your site on the home screen, and open it through the shortcut.

Progressive web app for Magento can be separate frontend app, so you could setup when you want to show this app and on what devices.

More academic definition of PWA you can find at Google page:
https://developers.google.com/web/progressive-web-apps/

Why eCommerce should start building apps with PWA. What are the main benefits

Okay, let’s see why the business is paying for the development of PWA applications.

We believe that Progressive Web Apps will be one of the top solutions for increasing user experience, mobile traffic and reducing bounce rate. Mobile traffic continues to grow, and in order for your site to work on mobile devices qualitatively and quickly – you need to implement PWA.

Also, a big plus is that PWA will help you increase the SEO ranking for your website on Google.

Quotes from the directors of the popular engine for eCommerce – Magento:

Comment from Peter Sheldon in 2017 (Vice President of Strategy, Magento Commerce)

“As 2017 draws to a close, we encourage commerce leaders to make sure that Progressive Web Apps are on your 2018 Magento roadmap and start planning for a migration from your current Responsive site to Progressive Web Apps next year.”

Mark Lavelle, CEO of Magento, stated

We see PWAs as a natural evolution of the mobile web, and by working with industry leaders such as Google to develop PWAs, we plan to keep merchants ahead of the curve.”

Let’s look at real cases.

Aliexpress

aliexpress

AliExpress increases conversion rate for new users by 104% with new Progressive Web App

  • 104% of new users across all browsers; 82% increase in iOS conversion rate
  • 2X more pages visited per session per user across all browsers
  • 74% increase in time spent per session

Olx

olx

One of the largest online destinations for classified ads in India, OLX provides communities in high-growth markets with vibrant online marketplaces. They connect local people so they can buy, sell, or exchange used goods and services, making it fast and easy for anyone to post a listing on the web.

OLX boosts re-engagement on the mobile web by 250% with a Progressive Web App

  • 23% less time until the page is interactive
  • 80% lower bounce rates
  • 146% higher CTR on Ads
  • 250% more re-engagement

Jumia

jumia

Jumia, a leading e-commerce website in Africa, showcased their eCommerce Progressive Web App (PWA) journey in 2016, outlining how they delivered an app-like experience to users through modern web capabilities. PWA has since proved to be far more than a buzzword—it’s now the de facto way Jumia builds for mobile devices. They’ve integrated Progressive web apps across many of their operations, including Jumia Travel.

Jumia sees 33% increase in conversion rate, 12X more users on PWA

  • 33% higher conversion rate
  • 50% lower bounce rate
  • 12X more users versus native apps (Android & IOS)
  • 5X less data used
  • 2X less data to complete the first transaction
  • 25X less device storage required

Many another Case Studies with PWA you read here:

https://developers.google.com/web/showcase/2017/

How to create PWA for your website. Which technology to use.

Let’s look at the practical question of how online stores can quickly implement Magento Progressive web apps for their business.

Progressive web applications can be created using JavaScript, CSS, and HTML. There are several solutions.

You can:

  1. Order custom development based on JavaScript
  2. Use a ready-made technology stack that will be “attached” to the backend of your website using the API

The MageDirect team offers you a second option.

Vue Storefront – headless PWA for eCommerce

Vue Storefront is a standalone PWA storefront for your eCommerce, possible to connect with any eCommerce backend (eg., Magento, Pimcore, Prestashop or Shopware) through the API.

Vue Storefront was created by Divante Ltd and currently supported with the help of a growing community. It’s open source application under MIT License. With these solutions, it was already created a live website that works pretty well.

More information you can find here: https://www.vuestorefront.io

How it works

Vue Storefront was built as an all-in-one front-end for eCommerce. This application consists of the following popular libraries:

  • vue.js as a front-end library
  • Node.js + Express as a server-API
  • Elastic Search as a database of products and full PWA/offline support

Then you connected the Vue Storefront with the eCommerce Platform and synchronized the data.

The product, category, etc. migrate to the NoSql database on the side of the Vue Storefront.

how-it-works

At the moment there is an excellent plug-in for the eCommerce platform – Magento.

More technical details you can read here:

https://github.com/DivanteLtd/vue-storefront

Main benefits

So the next main benefits you could get it from this solution:

  • you make one application for the frontend and next time if you want to change the backend – you do not need to migrate the theme
  • the application is convenient for scaling, you can store the front on a separate server
  • more traffic to your site, an extremely fast website and as a consequence more conversion

MageDirect offers development of PWA with Vue Storefront. So if you want to convert your amazing ideas in modern Progressive Web Apps – just let us now.

More details about our solution for Magento:

https://magedirect.co/solutions/progressive-web-apps-for-magento/

Valentyn Kubrak

Valentyn KubrakChief Operating Officer

Latest news and technical articles from MageDirect Team

Subscribe to our blog
Rate us
1 Star2 Stars3 Stars4 Stars5 Stars
(5 votes, average: 4.80 out of 5)
rating-magedirectLoading...
Bottom Top