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 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.

figure
Venia homepage
figure
Magento 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.

figure
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 cart, wishlist, and to compare.

figure
Magento Luma – Product block
figure
Magento Luma – category page in list view

In PWA Studio, a customer can see products only in grid mode, but it is possible to sort and filter products.

figure
Venia – category page
figure
Venia – filtering

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.

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.

figure
Category landing page

Don’t be so sad…

figure

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.
  2. Customizable options are not visible, and adding a product with customization options set in the backend is not possible.
  3. No option to add the product to the wishlist.
  4. No option to add the product to compare.
  5. A short description is not visible (but you can use this tutorial to add them to the product page).
  6. Product reviews are not visible, and there is no option to add new reviews.
  7. Related and up-sell products are not visible
figure
Magento Luma product page
figure
Venia product page

Product types

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

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

We know exactly what Magento Luma Checkout looks like, and what a difficult part of Magento it is. I hope that the PWA Studio checkout implementation will be easier to customize. The PWA Studio core team is currently working on the checkout process – it’s not finished yet but the progress is good, and the whole process looks pretty interesting.

figure
PWA Studio Cart page
figure
Venia – checkout – shipping information
figure
Venia – checkout – shipping method
figure
Venia – checkout – payment method

My account pages

My Account pages are currently under development in PWA Studio. For now, customers can log in/log out, and only the password reminder functionality works. Magento Luma has a big advantage here over PWA Studio.

Other missing features

Take a look at the list below, where other missing PWA Studio features have been listed:

Take a look at the official roadmap if you are interested to see when some of them will be finished.

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. The next issue is performance, and lack of support for server-side rendering which is important for many merchants. What’s more, 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!

Did you like it? Share!

Each share supports and motivates me to create new content. Thank you!

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

You may also like