Hyvä and PWA — the trendiest names in the eCommerce front-end environment. Both offer numerous advantages and both are loved by eCommerce brands. That’s why deciding between the two can be a challenging task.
To save you time and effort on research, we will delve into the definitions of Hyvä and PWA and explore the reasons to choose one over the other for your website’s front-end theme.
What is PWA?
A PWA stands for Progressive Web App. It is a technology that effectively bridges the gap between mobile apps and websites, taking the best features from both technologies. PWAs are extended websites with app-like features and functionalities. They let your customers enjoy the same experience as browsing a native app. When opened in a desktop browser, a website looks as usual, but in the mobile version, it can be installed as an application.
Progressive Web Applications leverage contemporary web technologies such as React, Vue.js, and Angular to facilitate front-end development. PWAs adopt a headless architecture, wherein the separation of the application’s front-end and back-end provides increased adaptability and scalability.
PWA’s core features are as follows:
- App-like experience. In terms of usability, interaction, and navigation, PWAs offer the same user experience as native apps.
- Reliable & speedful webpage loading. By default, PWAs have greater performance over native apps due to their lite nature.
- Device agnosticism. PWAs work on any device and any operating system.
- One codebase. There’s no need to develop and maintain a regular native mobile app for two different platforms – iOS and Android. You have one codebase for a website and two apps.
- PWAs can be built on Magento PWA Studio, thus being more native to Magento thanks to a native web app. Besides, your PWA will be compatible with all the upcoming Magento 2 releases as well as with the entire ecosystem of PWA-ready extensions developed by different Magento vendors.
- Top-notch security. PWAs use the HTTPS protocol, which eliminates the risks of various illegal activities like snooping, security breaches, content tampering, etc.
- Ability to send push notifications. PWAs make it easier to reach out to current customers and re-engage with the past ones.
- SEO-indexing. PWAs are identified by search engine crawlers letting you improve your rankings.
Migration Migrate seamleslly to the latest Magento version and enjoy enhanced performance, security, and functionality. Let’s make your upgrade process smooth and stress-free.
What is Hyvä?
Hyvä is a collection of themes and tools combined into a frontend designed for Magento 2, aiming to simplify and streamline the complexities of traditional Magento themes. By utilizing Hyvä, websites constructed with this frontend become lightweight and load quickly. Hyvä achieves this by overhauling the Magento frontend, reducing code and simplifying its structure, while still utilizing Magento’s built-in PHP templating system.
Hyvä is a monolithic system. It is fully responsive and can easily be used across different types of devices.
Hyvä Themes follows several principles.
- Reduced complexity. Hyvä is feature-rich and powerful while remaining simple.
- Improved performance. Performance is the key thing that Hyvä gets so much praised about, and it’s the theme’s key focus — to be fast.
- Better developer experience. Hyvä offers a developer-friendly environment and has a small learning curve for developers. This enables faster time to market.
- Enhanced development velocity. Because Hyvä is simple to use, the implementation and customization of Hyvä themes are rather fast.
- Reduced dependencies. Hyvä aims to reduce dependencies on third-party libraries. By default, there are only two dependencies in Hyvä themes, namely TailwindCSS and Alpine.js.
As a storefront owner, you’ll want to compare Hyvä and PWA by a range of aspects such as performance, functionality, scalability, pricing, and more. Let’s see what each of the solutions is all about.
Performance
Website speed is critical for customers. According to Think with Google, 53% of users leave a website if a page loads longer than 3 seconds. Besides, a low page speed score negatively impacts your SEO since Google relies on performance when ranking sites.
Hyvä focuses on high performance and considers it to be its key benefit. Hyvä employs the same backend functionality as Luma but effectively addresses Luma’s performance problems by substituting unnecessary JavaScript files and heavy libraries with a single JavaScript framework, Alpine.js. Furthermore, Hyvä leverages the Tailwind CSS framework to minimize CSS output.
These advancements lead to an exceptionally fast frontend that typically garners between 90 to 100 Google Lighthouse points. This outstanding performance also translates to enhanced SEO benefits. Please bear in mind that depending on the amount of customizations you apply and your team’s development approach, the speed and usability might become an issue.
As to Progressive Web Apps, they exhibit rapid and efficient loading, even under low or unstable Internet connections. PWAs offer high performance due to a number of reasons:
- PWAs use the browser’s cache. Hence, you can prioritize resources to be rendered before they are used.
- PWAs enable a more flexible caching of your files on client devices due to programmable caching. That means unique caching requirements can be easily handled. For instance, lazy loading of files that may be needed later in the session is possible. Web pages can also cache (non-static) API call responses during the session to reduce server load time.
- PWAs use Service Workers. They are JavaScript files acting as proxies between browsers and servers. Service Workers enhance the overall user experience and boost page performance by performing a number of functions and providing offline access.
Both Hyvä and PWA can render your web pages in under 2 seconds.
Functionality
In terms of functionality, Hyvä is quite simple. Hyvä’s basic functionality can be explained by the history of its development. Willem Wigman, its founder, built Hyvä to kick off an online shop for his wife. She specializes in jewelry collections with around 10-15 product items. So he aimed to create something extremely simple yet user-friendly. And he definitely achieved it.
The tendency for minimalism and complexity reduction turned into one of Hyvä’s core principles. While Hyvä’s simplicity and minimalistic approach are well-suited for early-stage eCommerce businesses and small local shops, medium-sized and enterprise-level storefronts may seek additional features and customizations. Nonetheless, it can still be a viable choice for larger businesses, depending on their specific needs and priorities.
Progressive Web Apps (PWAs) can provide a range of app-like functionalities, including:
- Offline mode to let customers browse product catalogs even with a poor Internet connection
- Add-to-home-screen functionality to enable users install the PWA and access it easily
- Push notifications to reach out to customers, engage with them, and retain them
- Automatic updates to ensure all latest features are available with no need to refresh the app manually
- and many others.
Scalability
Currently, Hyvä does not work with all available third-party extensions out of the box. To customize your store, it offers the Hyvä Themes compatibility library to make the most commonly used extensions compatible. Otherwise, you should aim for modules labeled as compatible with Hyvä. Upon obtaining a Hyvä license, you gain access to numerous compatibility extensions crafted by members of the Hyvä Themes open-source community. For instance, this library includes extensions like Klaviyo and Klevu for Magento 2, among others.
Properly installing and integrating these extensions necessitates collaboration with an adept development team. This is due to the fact that most Magento modules follow a similar structure to Luma themes, while Hyvä employs a distinct development approach, requiring adjustments to both JavaScript and templates for seamless and fast operation.
However, with the support of a skilled team, this task can be executed swiftly and effectively, as the modifications only pertain to the storefront output. There’s no need for alterations to the backend code, external integrations, or admin panel-related output.
Many companies and developers customize extensions to align with their specific requirements and contribute them to the Hyvä Themes library. Consequently, if you require a new extension, you can easily search the library and locate one that fulfills your needs.
PWAs offer a wide range of extensions and integration possibilities, contributing to their flexibility and functionality. The market of Magento PWA-compatible extensions is actively growing since extension providers start releasing PWA-ready extensions. With a rich ecosystem of extensions and integrations at their disposal, developers and businesses can tailor PWAs to meet specific requirements and deliver a more engaging and efficient user experience.
Development velocity
Hyvä offers a range of benefits that significantly improve the development process. Its streamlined and simplified code structure reduces development time and costs, making it easier for developers to tackle debugging issues and implement new features. With the potential to save up to 30 to 50% in average build time, Hyvä Themes also contributes to reducing the Total Cost of Ownership (TOC) for businesses.
Moreover, it prioritizes the developer experience by eliminating complex elements like RequireJS, Knockout, and UI Components, leaving behind only the enjoyable aspects of development, such as Layout.xml, Blocks, and ViewModels. The reduction in dependencies not only enhances developer satisfaction but also accelerates development velocity, resulting in more efficient and cost-effective software development projects.
The inherent advantages of PWAs, such as reusability of code across different platforms, simplified maintenance, and seamless updates, significantly reduce the development cycle. Developers can create PWAs with a single codebase that runs smoothly on various devices and browsers, thereby eliminating the need for separate native app development.
Additionally, PWAs enable real-time updates, ensuring that users always have access to the latest features and content without cumbersome app store submissions. This agility in development not only expedites time-to-market but also allows for quicker iterations and enhancements based on user feedback, ultimately leading to a more dynamic and responsive development process.
As a bonus, you achieve reduced development costs: instead of creating three separate entities (a website, an iOS app, and an Android app), you only need to construct a single app that functions effectively on any device.
Target business
Hyvä primarily targets small to medium-sized merchants starting from scratch, or those in need for the theme replacement in pursuit of speed. It’s a great option for them because the theme is designed to be faster and easier to use. You can effortlessly apply Hyvä to refresh your online store without the need to reconstruct your website. Hyvä is a great choice for businesses looking for a fast launch, having no scaling ambitions or plans to make substantial website changes in the future.
PWAs are suited for startups and small businesses with limited investment capabilities but we would also recommend it to more established eCommerce businesses who invest in research and development, and those with large product catalogs and vast mobile audiences. As PWAs also perform with low Internet speed, they are ideal for businesses with target customers in rural belts and off-beat places with poor connectivity. PWA also suits those who would like to experiment with the project UX.
Magento
Development Get an online store that sells. Woo customers with a seamless UX that guides them from the first point of contact to the checkout page.
Time to market
When it comes to time to market, consider several major factors such as agency’s experience with a specific technology, number of functionalities needed for the release, number of customizations you are planning to apply, as well as the complexity of integration with existing systems. The technology itself speeds up the time to market but the factors above play the major role.
Pricing
The Hyvä license fee is a one-time payment of €1,000. The merchant can use a product in a single instance of Magento 2. That means if you are running multiple stores on Magento 2, you will still require only one license. With a Hyvä license, you get access to the whole ecosystem: a Slack space, documentation, GitLab sources, compatibility modules, and support. Also, all Hyvä license holders get access to the Hyvä UI component library, which you can copy into your theme and adjust as needed.
In general, the price for Hyvä development is estimated to be €5,000-25,000 for less complex projects. The price tag for more complex projects will be higher. Additional costs include installation, customization, and support services (which can range between €11,000 to €90,000). Besides, you’ll need to purchase Hyvä Checkout as it is not included in the Hyvä Theme package. The price for Hyvä Checkout is a one-time fee of €1,000.
PWA development from scratch starts at around $50,000 for a small project. On average, the cost of a PWA can come close to $60,000-$70,000. But remember you get a website and two apps with their development. With no need to create separate codes for Android and iOS, let alone maintaining and updating those.
You can significantly cut development costs by using ready-made PWA products. To give you an example, our GoMage PWA Storefront already offers lots of out-of-the-box features on top of Magento PWA Studio as well as multiple ready-to-go integrations. This way, you’ll be able to reduce the starting cost to around $25,000.
Considerations when choosing between Hyvä and PWA
As you can see, while being different both Hyvä and PWA can be a great choice for your eCommerce business since they offer multiple benefits and outstanding features. However, when making your decision, you should consider all the aspects of the desired solution. Here are some things to take into account when choosing between the two.
Progressive Web Apps:
- Limited iOS compatibility
PWAs work on Apple devices with iOS 11.3 or later and encounter limitations on Apple devices, including the inability to use certain features like Face ID, Touch ID, Bluetooth, and others.
- Limited support for outdated browsers
PWAs are not compatible with older web browsers, meaning that users with outdated browser versions may not be able to fully access or utilize PWAs.
Hyvä:
- Limited compatibility with 3d-party extensions
Not all third-party extensions can seamlessly integrate with Hyvä themes. Most Magento extensions are constructed using the same technologies as Luma themes, which may lead to compatibility issues with Hyvä. Adapting these extensions for Hyvä often involves substantial reworking of JavaScript, templates, and CSS.
Both:
- Magento version upgrade required
Whatever option you choose, you’ll need to update your Magento version to 2.4 or higher. This may necessitate additional effort if you’re currently using an older Magento version. Nevertheless, the effort is worthwhile as it ensures you have a visually appealing and high-performing theme for your online store.
The final word
So which solution should you invest in? Well, there’s no silver bullet for every merchant. You need to rely on your specific business requirements and what you’re focused on. It’s only you who can make the final decision relying on the overview of both technologies we provided. We can tell that GoMage can help you with both. We have hands-on experience developing storefronts on Hyvä and PWA.
