PWA - The Frontend Revolution

09/09/2019 Industry news

Numerous online customers love shopping via mobile devices, this leaves webshop owners wondering which solution to develop to satisfy this target market: a responsive webshop or an app? Apps are faster and more user friendly, but developing costs are higher than responsive webshops. Moreover, online customers may not be inclined to install an app for a single purchase. Progressive Web Apps (PWA) combine the advantages of apps and responsive webshops within one solution. That is why, many online shops are currently considering a PWA.

 

This article is meant for all online shops that want to stay ahead of competition by investing in webshop technology.

 

What is a Progressive Web App?

Let’s take a step back, years ago the market changed from predominant use on desktop computers towards handheld screens, mobile and tablets. As ever, ecommerce business followed the trends to address their audience whenever and however they want, started designing and building interfaces to keep being relevant to their target audience. First this started with dedicated mobile websites and in some cases even dedicated mobile applications, both required a different way of building a great user experience and even different content management systems to keep track of all this. Years later this changed towards designing from a mobile-first perspective and responsive websites. Still some e-commerce platforms maintained dedicated mobile applications, but many did not as the costs were simply too high. Currently, responsive websites are ubiquitous but still lack some of the features that dedicated apps can provide in the user experience. As technology advances there is now a new option: PWA, Progressive Web Apps. You might have heard about API driven or micro-services or headless ecommerce and many more of these concepts. PWA is just another one to add to this list. A PWA is a set of technical guidelines (composed by Google) on how a website should be built. When one makes use of these guidelines, responsive websites are able to function as a native app on a smartphone. 

So what’s the big deal?

Traditionally, an ecommerce platform would provide both the backend and frontend for a webshop. However, with the arrival of PWA we completely surpass this concept. Why? For example, with PWA it is possible to run your backend on Magento 2 and your frontend on a Vue StoreFront based PWA. This is the basis of ‘headless’ ecommerce, your shopping platform provides the logic of which products you have, shipping methods, payment methods, etc. and simply provides API’s to tie this all together in a great user experience.

So what does this mean? An overview

PWA vs. Responsive webshop:

  • Available offline and accessible via app on home-screen
  • If the device doesn’t support PWA or there is no user permission, PWA just functions as a responsive website.
  • PWA’s are faster than a responsive webshop
  • Push notification to enhance repeat purchase
  • Full screen experience, the URL bar is hidden

PWA vs. Mobile app:                                                                           

  • No updates necessary
  • Easy to use (customer give permission instead of visiting the app store)
  • User friendly index with built in search engine.
  • App Shell – Reliably and instantly loads on your user’s screens
  • No development costs per different platforms
  • Indexable by Search engines, leveraging your content on mobile SEO

                                  

You can read more on PWA on Google’s Progressive Web Apps page.

Native AppResponsive websiteProgressive Web App
Push notifications      √                ×                  √
Functions offline      √                ×                  √
Available on homescreen      √                ×                  √
Full screen experience      √                ×                  √
One CMS      ×                √                  √
Device independent      ×                √                  √
No updates required         ×                √                  √
Indexable by search engines      ×                √                  √
No download required      ×                √                  √

So in the end this means that you have the best of both worlds and the advantages of a single platform, similar to how MultiSafepay provides a single payment platform to you but also the ability to leverage push notifications, offline usage and an app experience to your audience.

Ecommerce platforms and PWA

Although it is possible for a developer to build a PWA on his own, it remains as quite a challenge. Because of complexities within the ecommerce environments it is more logical to opt for an Open Source PWA solution. Which is exactly what MultiSafepay incorporates when developing Progressive Web App solutions. At present, there are only a few PWA providers in the European ecommerce playing field, namely Vue StoreFront, Magento PWA Studio and Deity.

MultiSafepay and PWA

Since version 2.3 Magento has been offering a PWA solution named ’PWA Studio’. This is particularly appealing to Magento users as they can trust the same platform to provide both backend and frontend solutions. The PWA technology is still rather new and only a handful of online shops are already implementing it. MultiSafepay started developing ready-to-use solutions for PWA at the latest hackathon with our partner Experius!

 

 

MultiSafepay is also experienced in using Vue StoreFront and will soon start publishing new components for React and Vue on our Github.

PWA for your webshop

There are many benefits when it comes to PWA’s, but when would be the right moment to get on board? To answer this question, we interviewed our Integration Product Owner Berend Lantink:

‘’If you recently invested in a responsive solution, I would recommend waiting and just keeping an eye on the progressions of PWA. For the numerous merchants that are now switching to Magento 2, I would however suggest to get on board of the PWA bandwagon right away. The development costs for the Magento webshop are conspicuous and the standard frontend is widely complex.

In general, I would advise merchants to have a word with their developers to scan through the possibilities and ask their advice on implementing a PWA.

Practically all ecommerce platforms are looking into PWA’s and offer various PWA solutions. At MultiSafepay, we are more than happy to help your developer with the integration of PWA platform, no matter what solution used.’’

The impact of PWA for the Development team

At the beginning of the ecommerce revolution, ecommerce platforms like OsCommerce were most popular. At that time, MultiSafepay founded its first development team to create plugin solutions. Developers mostly worked on fine-tuning plugins for merchants. As of now, webshop owners can download payment plugins and directly install them.

As time progresses this will all change, with PWA’s as the next big thing. Developers will start tailoring webshops based on multiple platforms and frameworks. For us that also means we will focus on providing merchants with a broader range of services. Next to developing plugins, we will also start offering different PWA solutions to empower your webshop.


Would you like to implement a PWA webshop or do you have any questions?

 

Contact us 

See our contact details

Or arrange a call back at +31 (0)20 850 0500