David Vršek is a front-end architecture specialist. We interviewed him on a current popular topic: progressive web applications.
Shopping through mobile phones has been one of the most important trends in e-commerce in recent years. PWA concerns mobile phones; can you please introduce PWA to me?
It should be noted that there is a difference between progressive web applications (PWAs) and single-page applications (SPAs). These two terms are often confused in the business sphere, and it is important to mention that PWAs are basically extended SPAs.
Websites used to work in such a way that each user request was first rendered on the server. When you browse the internet, servers have to load the entire web page, which is a slow method, wasteful for users and mobile phones.
Previously, when you came to a page, its header, content and footer — everything displayed for you — was always downloaded repeatedly. If you visited five pages, everything was downloaded again five times from the beginning.
This means that the name “single-page application” is really based on the fact that you are physically on one page, which, according to your browsing on the internet, gradually completes other parts of the page without downloading the whole page again. Because the browser does not have to analyze the entire HTML or cascading styles again, these pages are significantly faster and the content is rendered sooner. So, the result for the user is that especially on mobile phones, these sites are much faster, smaller and save mobile data.
You could say that PWAs extend SPAs, although not in the literal sense, because PWAs use the same basis as SPAs, which is the standard defined by Google. The fundamental difference for business is that, unlike SPAs, PWAs should function and look like native applications.
For example, you can simply save a PWA webpage to your phone as a bookmark, which, when opened, conveniently displays a full-featured website that is indistinguishable from a classic mobile application that you would otherwise have to download.
PWAs are similarly responsive compared to mobile applications. This means fast starting and browsing, and they can work in the offline mode. Offline mode means that, for example, in the e-shop, you can easily browse through the pages and products that you have already visited again. Some PWAs even allow for offline shopping. So, you can be offline, shop and, at the moment you reconnect to the network, everything is synchronized with the back end and the order is sent.
Is the PWA module incorporated in the e-shop, or how should our potential customer understand it?
This is the way the front end of a specific page is written. If you look at large companies, they very often function on websites and, at the same time, on their own application through which their customers shop. Among other things, PWAs are an effort for the websites to replace native mobile applications in the future. The main advantage is that the PWA site can work offline, which means that you only need to load its content once, and it continues to work independently as a full-fledged application for mobile devices. In addition, it is fast, smaller and cheaper to maintain. As a result, the PWA operator saves enormous costs on the development of mobile applications, but also the costs of operating on two actually unnecessary platforms.
How do you think PWAs will change user shopping processes in the future?
It is quite obvious that the trend of recent times is the purchase of goods via mobile devices. Whether it is smartphones or tablets, both beat classic desktops. People like to shop from anywhere they are comfortable; they don’t want to be limited by anything, and the times when you had to sit down at a computer to shop online are long gone. Thanks to the fact that PWAs behave like native applications (which you have to download via AppStore or Google Play) and replace the impression of using native applications, I expect that in the future, all big players, but also smaller companies, will be intensely interested in PWAs and will often implement them in their business plans. The very essence of PWAs is that the user should not be able to tell the difference between a modern application and a modern website.
Do you think PWA will hurt application developers?
I don’t think so, because a native platform can still do a lot today. Some things simply cannot be done with PWA or cannot be done so efficiently. For example, you can develop a computer or mobile game in PWA, but it will never be the same because PWAs are created primarily for business applications. Anything that needs strong HW acceleration (e.g., to calculate something extensive or work with a camera, etc.) is still better to develop in a native platform. PWAs are best used for web services such as online stores.
Native applications are becoming more sophisticated because they can work with the complete hardware of the given device. By this I mean, for example, GPS, camera and more. Try to imagine how often applications on your phone use its hardware — almost all the time. Even PWAs can use the hardware of the device, but within the web interface, it is still much more limited. So, the answer to your question, I think that mobile applications as such will not disappear from the market forever, but PWAs could really shake up mobile applications in the field of e-commerce.
PWAs have similar features to native applications, such as offline work or push notifications. How can these features be used for a common user, and what makes them interesting? What should I imagine under the “push notification” term?
Good question. Many of the benefits of PWAs are described on the internet, but there is no specifically explained example. Under the “push notification” term, you can imagine a classic notification that comes to you from an application or program that you have installed on any device. For example, a notification of what the weather will be like the next day or a notification that you have received a new SMS message. Can you imagine a website sending you a notification? It wasn’t possible, but it’s one of the few conveniences that PWAs bring. You only have to visit a website that works on PWA, grant it your consent to send notifications, and whenever the trader has made a laptop you have been waiting for a long time available, PWA will automatically send you a notification.
That’s why PWAs are called web applications, because they really behave like applications that have more sophisticated logic than the classic web. All this is possible thanks to HMTL 5 and the new API (Application Programming Interface), which can use new browsers for the above-mentioned functionalities, such as switching camera on, GPS, notifications and more.
Is PWA a big trend on the domestic scene in the Czech Republic at the moment?
The technology is not new, but the business discovered it relatively recently. We also need to realize that although the technology in its own form is not the latest, it is only now that mobile devices are faster, larger and much easier to use for online shopping, which was not so easy before. You can check your email via today’s phones, watch YouTube on the way by tram, and just as conveniently buy what you like or need. Nowadays, a phone for CZK 5,000 is fast enough to be able to reasonably render such an application and control all technologies such as working with the camera, GPS and more. Within this technology, it often happens that something is in a delayed state and there is a rational explanation for it. There is always something new designed, and the business simply cannot adapt to it immediately, because, for example, it is not stable or the machines are not strong enough for that. It is the same as in the gaming industry; there are algorithms that can be calculated by a graphics card for CZK 20,000 today; 10 years ago, it was a computer for millions.
What advantages and disadvantages would you assign to PWA?
The main difference is that these are no longer the old HTML pages that always re-render and their libraries download again. Perhaps the biggest and indisputable advantage is that PWAs are extremely fast compared to anything else. It’s basically the same as opening a complex mobile application on a state-of-the-art smartphone. Everything is immediate; you don’t have to wait for anything, and thanks to this biggest advantage, the customer meets an amazing UX and customer experience in general. It is known that PWA is used by business giants such as Uber, Tinder, Pinterest or Czech Dáme Jídlo. Why? Every user’s second means a potential profit, and the big players know it very well, which is why they use PWA. These are smart applications that save time because the page renders faster, downloads less data and can be more interactive. For example, if the user enables GPS tracking and PWA finds that the user is at your store, it will send them a notification with the discount of 10% and the note to visit the store. I may repeat myself, but here it is clear that PWAs are targeted to browsing websites via mobile devices, because PWAs can use the HW potential of these devices. Furthermore, it is possible to use a mobile device to scan a QR code, thanks to which a lot of information about the product will be displayed in the phone or a 3D model, video or anything else will be shown. You can simply see here how the virtual world connects with the real one, and it seems fantastic to me.
Do you see a great future in PWA from a personal point of view?
Yes, definitely. As for PWA, this is a path that everyone will now want to take, not just because they want to, but mainly because of users who use their phones for shopping more often. Another funny fact is that Google can remove you from a higher position in search results if your site doesn’t have PWA implemented. So, in my opinion, it is not a trend, but rather a logical future.
What role does the Magento platform play in the case of PWA?
Magento has started creating its own PWA studio, which is their framework for the development of PWA applications over Magento. This is something they are developing now; there are features such as those push notifications I mentioned, offline shopping and so on. In my opinion, Magento is aware that the web as such is aimed primarily at mobile devices. For example, Google monitors how websites follow PWA standards. As I mentioned a while ago, Google evaluates how fast websites you have, whether they download a lot of content; the better the performance and the faster the page renders, the better position the site gets from Google in search results. That’s why PWA is amazing, and that’s why Magento focuses on it.
David Vršek is front-end architecture specialist at Prague-based MageXo. MageXo is Professional Magento Partner/Adobe Silver Partner focusing on big B2B projects.