Adobe Commerce front end performance – Luma vs Breeze

The collection of files used to create the front end appearance of your Adobe Commerce store is called a theme. The theme controls your layout, templates, and the skins that create the look and feel of your site. 

A responsive theme adjusts the page layout that your site visitors will see to suit the device they are using, whether it’s a desktop PC, a tablet or a smartphone. Your theme can be modified and customized by your developer or designer. 

When you first install Adobe Commerce the design is based on a blank default responsive theme that you can customize but you can also see and use the Luma demonstration theme as a base. Your new site can be based on a new standalone theme, or it can inherit the default, Luma or any other existing theme. 

What is Luma?

The Luma front-end framework is based on the blank default theme. You will see Luma on Adobe Commerce demonstration sites. You can use it as the basis for your website although your developer might need to remove some of its custom styling and replace it with your own, depending on your requirements 

It uses basic JavaScript (JS) heavily and the way in which this is loaded and executed can make the front end performance of your site slow and less efficient. In addition, the approach to cascading style sheet (CSS) also results in inefficiencies which can slow performance. This is a legacy of the theme’s age – when initially developed it was a great option but time has moved on and the approach taken on modern sites has improved. It’s also complex which makes it time-consuming, and therefore expensive, to create a new theme based on Luma. 

What is Breeze?

Breeze is a theme developed by SwissUpLabs that focuses on performance by reducing the weight of the core code. The latest version of the free Breeze blank standalone responsive theme you can use for your Adobe Commerce store was released in March 2022, a more comprehensive theme built around Breeze is also available (Evolution). It doesn’t use either the default blank or Luma themes as its parent. The developer says it’s a clean, small, and fast theme that can speed up the front end performance of your site and our work with this on recent projects proves this to be true with a much higher performance score on page speed checks. 

It uses a different approach to Luna and the CSS is specifically written to keep file sizes as small as possible. There’s also a free Breeze JS front-end which can be used with Luma to speed up performance by replacing Luma JS with its own version without modifying the CSS or HTML. It also supports single-page application (SPA) to work inside a browser without page reloading to provide a faster page load time. 

Why front end performance matters

The front end of your ecommerce website controls what your customers will see and experience when they visit your ecommerce site. The back end of your ecommerce operation handles data such as prices, promotions, product images, order details, and fulfillment. 

Research has shown that the time it takes for a website or web page to fully load and appear on screen including text, images, and videos will affect the likelihood that customers will make a purchase. 

Google takes page speed so seriously that it is now included in its Core Web Vitals metrics so it will affect your search engine results. 

Seamless performance

Your front end and back end platforms need to work together quickly and effectively to meet your customers’ expectations. 

Front end – by prioritizing the user experience your front end will make sure your ecommerce website is easy to use and visually appealing to improve your conversion rates. 

Back end – in the background, your business systems will handle data access for products, orders, and customer information. Your back end platform processes, stores, and transfers data to and from all your customer touch points, including your ecommerce site. 

Traditional ecommerce platforms tightly link the front and back ends of your operation. This makes it easier to implement an online store but it also has some limitations. These tightly coupled monolithic platforms include multiple dependencies that make them inflexible and difficult to update. 

Adding apps to improve functionality can lead to performance issues that decrease page speed, introducing vulnerabilities and leading to JS and CSS conflicts that can have a negative effect on your customers’ online experiences. 

Maintaining consistency with the blank or Luma themes or a fast and flexible alternative like Breeze can help you to overcome these problems. 

Work with a trusted Adobe Commerce partner

Adobe Commerce is one of the world’s fastest growing ecommerce platforms. It is secure, robust and scalable and it’s functionality and flexibility make it a popular choice for all types and sizes of organization. 

Williams Commerce is an Adobe Commerce Gold Partner with EMEA Adobe Commerce Specialization based on more than 10 years of experience. 

Our fully certified team of developers understand not only how to build the system your business deserves, but also know how to get the best from Adobe Commerce.  

Whether you are planning to replace or upgrade an existing site or you are starting a brand new project we are fully focussed on optimization and acceleration. We’ll help you decide whether Luma, Breeze or another option will provide the best front end solution for your business. 

Talk to one of our experts today. 

Facebook
Twitter
LinkedIn

More Insights