In this article, I explore what Hyvä is, and why I think it matters so much for developers, store owners and customers. So, whether you have heard of Hyvä or not, or have already used it, this is my take on it.
I'm going to hit the ground running here (hold on to your cereal) - I believe the Hyvä theme is unorthodox and disruptive to the land of Magento themes, that's what is so brilliant about it. It has carved its own path of how it believes a Magento theme should be, not conforming to an old and disliked tech stack of Luma. It’s truly blown theme standards to a whole new level.
Developers are openly advocating their support for it and the tech stack it brings with it; AlpineJS and Tailwind CSS. I can understand why too - Its re-ignited a spark for Magento developers to enjoyably create Magento 2 websites again without feeling encumbered with the Luma tech stack, which is admittedly at times hard to work with - whether you were a Magento veteran or not.
The Hyvä concept
The Hyvä theme was created by Willem Wigman and is backed by many trusted vendors from the Magento ecosystem.
All the layout XML and template PHTML files have been re-written from the ground up too. This brings two big notable changes. The simplification of many different pages code - without compromising on functionality (like the product page). Allowing implementation of the themes design and functionality into Tailwind CSS and AlpineJS. Every page looks and feels very different to Magento websites we’ve seen in the past, and the best bit? It’s impressively fast. Blink and you miss a page-load. That feels worlds apart as a customer browsing the store compared to Luma, where speed definitely isn’t it’s strong point.
They’ve kept the layout XML system, so whilst there are newer additions the theme brings, there's just the right level of changes in the Hyvä theme codebase to keep it familiar enough and exciting for you to hit the ground running.
Earlier in this article, I mentioned how I thought the Hyvä theme was unorthodox and disruptive. This isn’t a negative point. I wholly believe the frontend developer experience for the Magento 2 Luma theme drastically needed bringing in line with modern technologies and practices. It is slow to develop and build on what is considered by the Magento community as either outdated or unpopular frontend libraries. Though I have got used to the quirks and downsides of Luma, I definitely didn’t enjoy them anymore.
Magento has seemingly moved their focus onto PWAs in terms of themes, so it doesn’t look likely that they will concentrate on an overhauled version of Luma. And while there have been 3rd party themes crop up in the Magento community, none quite made the opinionated and bold leaps that Hyvä has done so successfully. It’s done this while staying rooted to some classic Magento 2 theme concepts, like the Layouts system that works so well for flexibility. So if a PWA isn’t the right fit for your website, you have a powerful alternative to use that is just as fast, flexible, and impressive, and most importantly, doesn’t take as much time or money to develop on, compared to a PWA.
The speed of Hyvä is what's really impressive. Out of the box, it’s blazing fast, the Lighthouse scores are 100 in each category, that’s no easy feat. It’s important to note that while it may have been acceptable for Luma to be relatively slow and cumbersome when it launched, the growing importance of page speed and accessibility is higher than ever. Having a low page speed score affects your SEO. Having top page scores out of the box gives Hyvä a huge benefit over Luma here.
The Developer Experience
The learning curve for making changes in the frontend for Hyvä is much easier than it ever was with Luma. Logic and styling is isolated to mostly single PHTML files. The layout XML is decoupled better from the PHTML, though it’s still there and flexible as ever, the power to style the page has been handed back over to PHTML files again. There is no better example of this than the Product Page. Which previously required extensive knowledge of the product page layout XML to make any notable layout changes.
The theme is using technologies that new developers are perhaps already learning too, which means more people can work on the front end, giving a lower barrier to entry for implementing designs and making changes.
To achieve high Lighthouse scores with Luma, you must fight hard to achieve this, with a whopping 250+ requests from the Luma theme, it's no wonder Luma is hard to get great page scores with. This is where Hyvä particularly comes into its own, it’s really fast, and has 100 in each lighthouse category, out of the box. Which not only is a big deal for developers trying to make the website as efficient as possible, but also a great piece of mind for the store owners.Closing Words
Wigman has outlined his technical vision for Hyvä, they are impressive aims, but what's more impressive is that they have all been achieved too. You can see why certain changes have been made to the theme, it really does contribute overall to a refined experience.
Improved developer experience
Improved development velocity
Reduced learning curve
All the work put into the theme and the direction it has been confidently taken and all works together so well. It’s different. But in a fabulous way. The choices made go against the grain of what people are used to. But I believe the change was needed, it has allowed developers to have what I think is a better developer experience when creating Magento 2 websites. And that's why this theme over countless others, really stands out. It has made a great impact on the developers, customers and store owners.