It’s for sure people hate when a web page loads longer than 3-5 seconds. Even 1-second lag leads to 12% fewer website views, 16% drop in customer satisfaction and 7% loss in conversion rate. Sounds impressive, right? If we don’t want to lose potential customers, we need to optimize the website. How to speed up Magento website? Here is when refactoring is needed.

If all the website’s functional totally suits us, but the code is too heavy and overloaded with superfluous comments, we need to “clean up” the mess – and this is the main goal of refactoring.

High conversion rates (and, what is more important, a customer loyalty) are key factors of successful e-commerce activity. Reducing page loading time is necessary not only for increasing of popularity among users and reduce the bounce rate, but it also helps to achieve higher positions in search engines. Since 2010, Google pays special attention to the websites’ loading time in determining the page rank.

You can build Magento marketplace using a lot of useful features of this CMS. But still the platform has some bottlenecks that can prevent entrepreneurs from gaining a bigger profit through low checkout conversion rate. For those who are familiar with Magento, it’s not a secret that this e-commerce engine is quite demanding on the hardware, server setup, and shared hosting. But the developers of this CMS have tried to solve the problem and came up with many different solutions how to do performance optimization in Magento effectively.

Refactoring Practices. Where to Begin?

The first thing you need to do is to test your website with GTMetrix or Google Page Speed. These free services will help you to find out what errors are really slowing down your website. We’ve prepared a small manual how to improve your Magento 2 website. Let us show you how to do it on the example of projects performed by our backend developers. The most illustrative one is Styled.

#1. Use CSS Sprites

All websites contain a lot of small images, such as arrows, hearts, pluses etc., which are the elements of the interface. And each time user opens the website, browser makes dozens of requests to display them all. In Styled we used CSS Sprite – it is a combined image that contains all the interface’s small images that would be cut at the right moment for the desired page element. This has reduced the number of requests to the serverand, in such way, we could speed up Magento website.

Use CSS Sprites

#2. Magento Speed Optimization Via Caching

Caching is one of the best ways to optimize performance. One of the useful instrument of Magento is Full Page Cache (FPC). Once you turn FPC on in the admin panel of your website, it allows to send a page to the server just in a few milliseconds, without an overloading. Thus, website will process pages for visitors much faster.

We’re Whidegroup

We develop optimized
e-commerce stores.

#3. Merge and Minify JS and CSS

Merging JavaScript and Cascading Style Sheets dramatically decreases the number of requests from many JS and CSS files to the database, practically, to single one. It means, that your browser won’t make dozens of requests at the same time. All the JS and CSS will be merged into single file, and it would be faster for a server to load it instead of many. Reducing the number of requests is a very effective method of website speed acceleration, because even if the server is close enough to the end-user, each request takes from 20 to 200 ms. Together with merging of files, minimization is also effective. It is a rewriting of many-lines contents into single array with minimum notation. Minimization usually reduces the file size by 20-40%. There are a lot of tools to minimize code, some of them are third-party, other are from the box. In this case we implemented a third-party module to merge and minify all the JS and CSS. We got one 609 Kb JS file and two 158 Kb and 322 Kb CSS. After we minified them on 5%, 27% and 41% accordingly and got amazing results: now the website loads in 2 seconds (from 3.1 – 7.2 seconds previously).

Magento Performance Optimization – Decrease Loading from 6 to 2 Seconds

#4. How to Speed up Magento Store by Resolving Incorrect Formations of Libraries and Collections

There is a related products block we used on another project Kjellmann. There was a bug: “You may also like” module each time loaded all the products that could be related to the chosen item (more than 200) but only five were actually displayed. There was no limit in amount of items to be processed. So, the server was handling with hundreds of products instead of a few, which had led to the memory overloading, and, as a consequence, the speed of the website went down. This problem was solved due to the use of cloud service, which integrates with the website, sends data to the cloud and systematizes them. Then it gives back the most popular five products. In this way, there was no need to process them all using own server and overloading it. Search on the site was also realized through third-party servers.

Speed Matters

Enhancing of the website speed load is an important and complex issue that is actual not only for desktop version of websites, but their mobile version too. According to researches carried by Amazon and Walmart, every 1 improved second gives a 2% increase in conversions and vice versa, so it’s really important to concentrate on Magento performance optimization. There are a lot of solutions to handle with the issue: from CSS sprites to merging and minification of JS and CSS. Some of these tricks are easy to implement, while other require some technical experience. After applying mentioned techniques at the projects our developers worked on, the number of customers attracted to our clients’ websites has increased substantially. Have you ever thought the load speed of your website would be so important? Try our Magento speed optimization service and learn how powerful your website can be!

Magento Performance Optimization – Decrease Loading from 6 to 2 Seconds
14 reviews 5 stars of 5