PWA Studio vs. Magento Luma: features comparison

PWA Studio vs. Magento Luma: features comparison

PWA Studio is growing, and month by month, new features are being added. PWA and headless are hot topics right now, but the current Magento monolithic frontend based on the Magento Luma theme is still the first choice for merchants. There are a few reasons for this:

  • The current frontend is stable and well known

  • There are many developers experienced in Magento theming.

  • Merchants can find a lot of third-party extensions for the current Magento frontend.

  • And much, much more.

The crucial fact here is that the current Magento frontend has many more out-of-the-box features compared to PWA Studio.

In this article, I want to show you the differences and the current State of PWA Studio and its plans for the future. We will focus on out-of-the-box features. If you want to read about the differences on the tech side, take a look at one of my recent articles:

What is the difference between PWA Studio and the current Magento frontend?

CMS content and Page builder

Page builder lets you create CMS Content with an easy drag & drop visual editor. PB is part of Magento Enterprise Edition, and it’s supported by PWA Studio as well. Take a look at the latest Venia demo homepage, which is built using Page Builder.

PWA Studio homepage:

PWA Studio homepage

Magento Luma homepage:

Luma homepage

I have noticed some limitations and things that haven’t been done yet. For example, when you add the Products list widget to your CMS Page/block, the content of this widget will be displayed in a PWA Studio instance without styles.

Category & search results page

The primary functionality here is displaying products. Using the current Magento Luma frontend you can see products in list or grid mode, sort, and filter them. You can also use pagination if there are many products.

Magento luma category page – grid mode:

Magento luma category page – grid mode

In addition, the customer is able to select product options (in this case color and size) and add the product to the cart, wishlist, and to the comparison.

Magento Luma – Product block

Magento Luma – Product block

Magento Luma – category page in list view

Magento Luma – category page in list view

In PWA Studio, a customer can see products only in grid mode. Filtering and sorting products work as well

Venia – category page

Venia – category page

Please note that in PWA Studio, a customer is not able to add a product to the cart directly from the category page. * In this case, a customer needs to go to the product page and then add the product to the cart. In some cases that’s OK, because Merchants want the customer to buy through the product page where there are more product information and related products.

* Adding a product to the cart from the category page is planned by the core team for implementation in 2021.

The last thing I want to discuss in connection with the category page is the functionality commonly known as the “Category landing page”. In the administration panel, you can set the display mode to “Static block only” for the selected category and select the CMS block to be displayed. Unfortunately, this does not work with PWA Studio, where only products are always displayed.

Category landing page

Category landing page

Don’t be so sad…

Don’t be so sad…

Here is the tutorial describes how to add support for category landing pages to PWA Studio.

Product page

The product page looks great and works superbly in PWA Studio, but there are some limitations compared to Magento Luma:

  1. Video in the gallery does not work in PWA Studio. (related Github issue: https://github.com/magento/pwa-studio/issues/2933

  2. Customizable options are not visible, and adding a product with customization options set in the backend is not possible. (related Github issue: https://github.com/magento/pwa-studio/issues/2025

  3. No option to add the product to compare.

  4. A short description is not visible

  5. Product reviews are not visible, and there is no option to add new reviews.

  6. Related and up-sell products are not visible

Magento Luma product page:

Magento Luma product page

Venia product page

Venia product page

Product types

Magento gives merchants the ability to add a few types of products:

  • simple product

  • grouped product

  • configurable product

  • bundle product

  • virtual product

PWA Studio currently supports only simple and configurable products.

Checkout process

Minicart

Minicart is available in both Luma & PWA Studio storefronts, but in PWA Studio there is no possibility to change product quantity directly from the mini cart.

Cart & checkout page

The PWA Studio provides an internal checkout flow (including Minicart, and a separate Cart page)! We know exactly what Magento Luma Checkout looks like, and what a difficult part of Magento it is. Fortunately, The PWA Studio checkout implementation it's much easier to customize.

PWA Studio Cart page:

PWA Studio Cart page

Magento Luma cart page:

Magento Luma page

Venia – checkout – shipping information:

Venia – checkout – shipping method

Venia – checkout – shipping information

Magento Luma – shipping step:

Magento Luma – shipping step

Venia – checkout – payment method:

Venia – checkout – payment method

Magento Luma payment step

Magento Luma payment step

My account pages

PWA Studio supports a few account pages like:

  • Order history

  • Favorites Lists

  • Address Book

  • Saved payments

  • Communications

  • Account information

Venia - My account - wishlist:

Venia - My account - wishlist

Magento - My account - wishlist:

Magento - My account - wishlist

Other features

Take a look at the list below, where other PWA Studio features have been listed. Those featured are developed mostly in last year which shows how much progress the PWA studio core team is making with the help of community contributors.

  • Internationalization/translation support

  • Multistore support

  • Mega menu

  • Extensibility framework

Missing features

There are still a few features that PWA Studio does not support yet. For instance:

  • Product reviews

  • Cross Sell, upsell, related products

  • Video in gallery on Product Detail Page

  • Many of Magento Enterprise and B2B features

Take a look at the official roadmap if you are interested to see what will be done in next year.

Conclusion

PWA Studio is growing quickly and it is definitely the future of the Magento frontend. The main problem here is that the current Magento monolithic frontend has many more out-of-the-box features and thousands of third-party modules and themes, I think that the lack of full support for Progressive Web App technology on the iPhone (Safari) effectively prevents the development of all PWA applications (not only PWA Studio).

It’s difficult to say exactly when the PWA will replace the current M2 frontend, but it will definitely happen, and I see that PWA Studio is quite better year by year!

About the author

Marcin Kwiatkowski

Certified Magento Full Stack Developer, based in Poland. He has 7 years of professional Software engineering experience. Privately, husband, father, and DIY enthusiast.

Read more