Reach 99% on Google Page Speed Insights with the Milkyway 2.2 theme for Magento & Adobe Commerce
- Technology
- 26.01.2023
Reach 99% on Google Page Speed Insights with the Milkyway 2.2 theme for Magento & Adobe Commerce
Intro
You are probably familiar with the saying “time is money” right? Well, when it comes to e-commerce websites performance, that saying could not be more true. Even milliseconds can have a significant impact on your sales.
Contents
/ 0 MIN read
Research conducted by Deloitte found that even an improvement of 0.1 millisecond on mobile devices can lead to an increase in eCommerce transactions by 8.4%, and the average order value increases by 9.2%. And, this is just on a mobile device, imagine the possibilities!. Check the research here.
Search engines place high importance on speed and performance. In order to rank higher in search results be sure to consider these factors when determining the relevance and domain authority of a website.
Better ratings → more traffic → more sales.
At interactiv4 we recently released a new version of the Milkyway theme which is a part of our Optimo Accelerators for Magento and Adobe Commerce. So far the new version shows great results on Page Speed Insights with up to 99% improvement on desktop and up to 90% improvement on mobile depending on the page complexity.
For our clients, it means that we can safely upgrade the new theme to version 2.2 and achieve better results for their stores. If you are looking to migrate to Magento and Adobe Commerce but have doubts regarding the performance, the Optimo Accelerator will surely remove any doubts you have.
We’ll also dive into the details of the Milkyway theme and its performance improvements, as well as provide a brief introduction to our Optimo Accelerator program for those who may not be familiar.
Table of contents:
CHAPTER 1
What is Optimo?
Optimo is an accelerator for Adobe Commerce and Magento that enables us to launch ecommerce stores 2-3 times faster and with a wider number of features than ecommerce platforms initially offer.
This approach not only allows us to launch online stores faster, but deliver them at a fraction of the cost to you, while providing better experiences for your customers.
Optimo was designed in 4 different versions, each with a set of functionalities reflecting different business models and needs.
- Optimo One – a solution that covers most of the needs of any eCommerce project.
- Optimo Retail – a solution that connects customers experiences to your ecommerce and offline retail channels.
- Optimo B2B – a solution designed to cover the needs of B2B businesses.
- Optimo Marketplace – a solution that includes integration with Mirakl to extend the possibilities of your ecommerce and add marketplace functionality.
Chapter 2
What is Milkyway?
Milkyway is the theme that was specifically developed for Optimo solutions. It is a unique visual theme that is created from scratch based on native Magento frontend technology. The best part is, it does not add complexity to your technological stack which helps keep Milkyway’s maintenance costs low in the short, medium, and long term.
Milkyway offers several pre-defined themes to cover needs of different business models: Milkyway, Milkyway B2B, Milkyway EE, and Milkyway Mirakl.
To see the theme in action, check out this link https://demo.optimocommerce.com
A new version of Milkyway 2.2 is now available
The first version of Milkyway allowed us to drastically speed up development in Magento 2 and Adobe Commerce. And, at the same time provide an improved experience for users that helped guarantee results.
The second version of Milkyway places an increased focus on improving performance, and offering users an even faster browsing experience.
What advantages does Milkyway 2.2 bring?
- Improves online store sales conversion, increasing the average check.
- Improves user satisfaction and increases the likelihood of recurring customers.
- Improves SEO. With higher SEO rankings in search results, it will help drive more traffic to your store
- Reduced maintenance and update time.
As we already mentioned earlier, website performance plays a significant and measurable role on conversion rates. Studies have continually shown that web pages with higher performance speeds lead to a better conversion rate.
By ensuring better performance of Milkyway, we increase conversion rates of the site.
But let’s skip to the interesting part, results.
Below you can see the scores (provided by Lighthouse) relating to performance, accessibility, best practices, and SEO that our Optimo demo is giving.
Homepage Results
Category page results
Product page results
Chapter 3
What improvements were made in the new version?
Image optimization
Image optimization is crucial if you want to reduce loading times. This will drastically reduce the waiting time for users and thus will be a driving force to help increase conversion.
What steps have we taken to improve performance:
- Optimization of all images used in the theme.
- Optimization of catalog images through the CDN, adapting the configurations from Magento, and on the infrastructure provider’s server.
- The TTL of the resources is increased on the server side, adding the max-age attribute to the request headers. This generates a better score in google.
- We use native lazy loading, available in the most recent browsers, thus avoiding loading scripts that reduce performance.
- Preload for LCP (Largest Contentful Paint) images, a functionality which has been added to activate a preload of these images in Home, PLP and PDP.
Font loading optimization
Every detail matters when it comes to optimization. When it comes to fonts, we improved loading and displaying of fonts, plus the addition of more and new compatible font formats.
JS optimization
JS enhancements help reduce wait time before a user can interact with a page. This in turn leads to a greater sensation of speed.
What improvements have been introduced:
-
- The amount of js code is reduced and libraries are updated to improve performance and avoid vulnerabilities.
- Now the system avoids loading unnecessary Magento core libraries and js which helps create a faster loading of the page.
- An advanced JS minification, moving script loading to the bottom of the page.
- Changing imperative calls to declarative calls in require. This helps us save execution time on page load and as a result decrease total block time:
-
-
- If we have less js execution, our page will be blocked for less time.
- Declarative scripts are asynchronous, so they won’t block our thread in the browser on page load.
- Smaller and lazy loaded scripts mean page content won’t be blocked when executed.
-
-
- Change in the loading of sliders. Use of Snap instead of Slick, as this is built with CSS functions it’s faster
- Using Rocket Loader on Cloudflare. Rocket Loader is a Javascript accelerator to make the web page load faster. It makes for a much faster loading experience for users and improves performance metrics.
Optimization of CSS
With the best of CSS improvements implemented, we’ve reduced styling loads and created much more readable and reusable code. In turn, this helps reduce maintenance timelines.
- Cleaning of CSS files removing unnecessary code.
- Better organization of styles to facilitate changes.
- Use of modern style properties and compatibility with the vast majority of web browser rendering engines.
Design improvements
The previous version of Milkyway was built to ensure a smooth user experience on the site. But there is no limit to improvement. In the new version, we’ve made some changes to also ensure a more comfortable navigation experience.
How this benefits you
It’s very easy: Don’t take another second to think about it and instead, seize the opportunity to make your store faster and start boosting your conversion!
If you already have Optimo, contact your account manager and request your personalized budget for Performance Pack 2023. You can even update Milkyway if you have a Magento version which is no older than 2.4.3.
If your store is built on another technology but you’re exploring new alternatives, reach out to us! We’ll provide more information on our accelerators.
Let’s build something great together!
Do you want to improve the results of your online store? Get in touch with us
Related content
