Blog

PWA for Magento: opportunities and hosting requirements

Progressive Web Apps (PWA) are a hot item in the current development landscape. Many people in the IT crowd are reading and thinking about them. But the thing is that there are not many real-life cases to properly showcase the technology yet. This is especially true for the European retail market. Therefore, it is worthwhile to put the spotlights on Progressive Web Apps and their possible benefits. What are PWAs? And what opportunities and extra functionalities does this new technology have in store for online shops that are powered by Magento?

What is a PWA?

You have probably heard a lot about the many redeeming qualities that Progressive Web Apps possess. Many tech experts believe that they have the potential to push the mobile web forward and help mobile developers reach more users beyond the confines of the traditional app stores. That sounds great, but what are Progressive Web Apps exactly?

“PWAs are mobile-centered apps that use state of the art web capabilities to deliver an app-like user experience.” That’s how Google defines this relatively new phenomenon. You may not always notice it, but the native apps that you buy at the app store are very versatile. Sending push notifications, working offline, loading on the homescreen, these are just a couple of important tasks that they perform. Mobile web apps accessed in a mobile browser, by comparison, have always been more limited when it comes to the number and complexity of available functionalities.

This is where Progressive Web Apps come into play. They transport features that are traditionally associated with native apps to the mobile browser experience. To do that, they use standard-based technologies and run in a secure container accessible to anyone on the web. The powerful service users of Progressive Web Apps power offline functionality, push notifications, perform background content updating and regulate content caching. PWAs are started from your web browser, but can be stored on your smartphone. You also don’t have to download them. Therefore PWAs always remain up to date.

How do PWAs work?

PWAs pretty much function like traditional web applications, but are enhanced with modern web features and technologies. Hence the adjective ‘progressive’. PWA technology is based on open source standards and relies on HTML, CSS and JavaScript. When you install PWAs, the applications will receive their own window or shortcut on your taskbar if you use Windows 10 or Chrome. If you are an Android user, the PWA will appear as an icon on your home screen.

Progressive Web Apps and Magento shops

Magento has acknowledged that it sees PWA as the holy grail of future web solutions. The company believes that PWAs have the potential to completely change the e-commerce landscape, a revolution that could be similar in magnitude to the transition that happened years ago from conventional desktop sites to websites that rely heavily on responsive web design. Magento is momentarily working on its own PWA which shall be named PWA studio.

Major benefits of PWAs

The enthusiasm for PWAs that Magento and companies like Google (who coined the term PWA) display, is fueled by some major potential benefits that these web applications bring to the development playing field.

  • Progressive Web Applications are outfitted with service workers. These AIPs allow you to run JavaScript in the background. This innovation is very useful when it comes to improving functionalities like preloading content, synchronizing and receiving data and sending push notifications.
  • PWA makes it possible to speed up and cheapen the development of apps. Currently, you often have to develop separate versions for Android and iOS. Progressive Web Applications are designed to work anytime, anywhere.
  • PWAs are not only suited for mobile devices, but also desktop-friendly.
  • PWAs are SEO-friendly. Google already announced to favour PWAs in future ranking algorithms.
  • PWAs improve the performance of your Magento store. PWAs provide smoother scrolling and transitioning of pages. This largely removes the need for pages to reload.

PWA hosting requirements

But how do you host Magento Progressive Web Apps? This shouldn’t be very complicated. The chief requirement is that the PWA is served by a valid and secure HTTPS connection. To make full use of the service workers that run in the background, the specification of the PWA requires it to be hosted over HTTPS. Besides this fundamental aspect, there are a couple of other requirements for implementing Progressive Web Applications.

  • You have to make slight adjustments to your server configuration to make PWA hosting possible. You can easily do this yourself when you use an unmanaged VPS, but this is often not the case if your Magento Progressive Web App has to run in a managed hosting environment. Luckily, Hypernode is the exception to this rule. Although it is a managed hosting environment, Hypernode allows you to change your NGINX configuration in order to make Hypernode fully compatible with Magento Progressive Web Apps.
  • Not a hosting requirement, but PWA requires the browsers to support service workers. This tool is responsible for key tasks and features like caching files, push notifications, content updates and data handling. All most commonly used browsers like Chrome and Safari do.

Hosting a PWA on Hypernode

Hypernode can be fully PWA-compatible. Which is pretty unique for a managed hostingplatform by the way. Hypernode is a managed platform which offers the flexibility to make changes to the standard configuration. And with some slight adjustments to this standard configuration you’re ready to launch your first PWA. Several Hypernode users already did and we can even help you with that.

If you do launch your first PWA on Hypernode, please let us know what we can do to make it even more easy for you. Do you want us to add tooling or software to the standard Hypernode configuration, do you want us to automate PWA-related processes? We’re open for suggestions and feedback.
Just give us a call or send an email to support@hypernode.com.