A slow webshop is no longer of this time. Many studies have shown that the slower the shop, the lower the conversion. And also search engines, but especially Google is punishing this more and more harshly. In short, every reason to go for ultimate speed performance. Especially when a lot of customization is added to the webshop and the maintainability of the code is also at stake, both the front end and the back end can sometimes feel slow. Both the visitor, the administrator, and the developer are of course not waiting for this and that is why we have written this extensive guide to significantly improve the speed of your Magento 2 webshop.
This manual is intended to get your Magento 2 webshop lightning fast and focuses on the entire application. With the aim of not only getting a fast frontend but also a fast backend. We were born from a Magento development agency and have built, maintained, and developed shops for years. In addition to security, our most important core value has always been performance.
We are happy to make this knowledge available to provide you with an even faster Magento webshop. This guide has been set up in such a way that you can do a lot yourself and where necessary you can easily enlist the help of a developer.
Magento speed optimizations will be discussed
In the end, we cover 14 optimization points:
- Update to the latest Magento 2 version
- Enable lazy loading for images
- Use a Content Delivery Network (CDN)
- Caching Options
- Remove unused plugins
- Choose a blazing fast web hosting
- Make use of a quick search functionality
- Make use of Varnish Cache
- Update Indexes
- Make use of GZIP Compression
- Make use of HTTP/2
- Never use JS combining
- Run your shop in production mode
- Optimize your CSS
Let’s start 😃.
Test the speed of your website/webshop
Before you start it is good to do a zero measurement. After all, only then will you know whether the optimizations you implement actually have an effect. Sites to measure the speed of your website are for example:
- GTMetrix
- Pingdom
- WebPageTest
We explain these and more tools in this blog article about testing the speed of your website. It is important to select a location that is as close as possible to the location of your data center/hosting provider. This paints the most realistic picture of your results.
One of the most important metrics here is the Time To First Byte(TTFB). This is a measuring instrument that provides insight into the response time of the web server. In fact, it says how much time it takes to receive the first data packet back from the web server. The lower the time the better this is. There are several ways to further lower the TTFB. For example, you can make a profit with Magento-optimized hosting, but there are also countless options for tackling this from within the application. For this, you need a good Magento developer. Of course, we advise you to score as well as possible on all metrics. It is therefore advisable to spend time on this. Start by forming a good image. Do this in a Google Spreadsheet so that you can make a good comparison after you have implemented speed optimizations from this article.
1. Update to the latest Magento 2 version
If you are running on an older version of Magento 2, you may not yet benefit from the optimizations that Magento and/or the community have made in the latest updates. A lot of attention is paid to the speed of Magento. This often includes performance optimizations that provide a direct speed gain for both the front-end and back-end. Please note: do not just update. Magento updates generally do not run smoothly and are not implemented at the touch of a button. So make sure you always have a backup and test it first on a test environment, for example.
It is also good to have a Magento developer who can provide support where necessary to quickly resolve issues that arise. Some things that have been greatly improved in recent updates:
- Response time of the catalog, search and advanced search pages have been significantly improved
- Product page gallery load optimization
- Improved page rendering through deferred loading and parsing of JavaScript
All other optimizations can be found on the Magento website.
2. Enable lazy loading for images
Images generally have a major impact on the speed of your website. Loading too many images at the same time on a page not only has a huge impact on the speed but also on your page speed scores. A best practice for not loading all those images at once is Lazy Loading.
With lazy loading, you ensure that images are only loaded when they actually appear. This means that the browser does not try to load the entire page at once, but instead prioritizes loading visible content. As the user scrolls to the bottom of the page, new content is loaded along the way. Lazy Loading first shows a lower-resolution image or a placeholder image, then immediately transfers it to the high-quality source image. To use Lazy Loading you can ask for help from a developer or, for example, use a (free) extension that handles this for you.
3. Use a Content Delivery Network (CDN)
A content delivery network (CDN) refers to a geographically dispersed group of servers that work together to provide fast delivery of online content. A CDN allows for the rapid transfer of resources required to load the content such as HTML pages, javascript files, stylesheets, images, and videos. (Source: Cloudflare). A properly configured CDN can also help protect websites against some common malicious attacks, such as DDOS attacks.
So using a CDN helps to improve the page load speed of your Magento shop, while also reducing your bandwidth consumption. A CDN has the most effect on performance if you actually get visitors from various countries on your website. We see that many webshops use the CDN that Cloudflare offers. So be sure to check out their website!
4. Caching Options
A fast webshop naturally requires well-set caching options. One way to optimize this is through Nginx configurations. For example, you can set how long the cache of certain file types may be kept. With a professional agency, the expiration time of many static files is already optimally set by default.
We will post an article regarding optimized Nginx configurations as a separate guide soon. Are you already interested in further optimizations? Then please contact us.
5. Remove unused plugins
If your webshop has been around for a while or if, for example, you do not have access to a good developer, it may be that you provide your Magento webshop with the necessary Magento plugins. It is of course nice that these plugins are available and you do not have to hire a Magento developer for many extra functionalities to functionally improve your webshop. However, there is also a disadvantage to installing plugins. They often have a negative influence on the performance of your webshop.
As far as plugins are concerned, the following really applies to us: less is more. The more functionality a plugin offers, the greater the chance of performance issues. Look for plugins that really do what you need, but certainly no more than that. So check on a regular basis whether you are still actively using plugins or whether they can be replaced by custom code or another optimization.
6. Choose lightning-fast Magento web hosting
A low-impact way to improve the speed of your Magento webshop is through well-optimized Magento hosting to choose from. The range here is large, but not every party actually offers Magento-optimized hosting. There are many different solutions ranging from large to small and it is important to choose the right package. Your Magento webshop needs good hosting to offer your users a good experience.
In addition, it is also important to handle various backend processes faster. Therefore, pay attention when selecting the right hosting package and especially look at the available resources. The most important resources are memory, CPU, and storage capacity. It is also important that you select hosting that not only gives you a fast connection, but also high-security standards and good support in case of downtime.
7. Make use of quick search functionality
For webshops, the search functionality is often one of the most important functionalities in the battle for high conversion. A fast search function is therefore a must. Magento has now made Dutch Elasticsearch the standard for search engines within Magento. This a great development that we absolutely welcome!
Another very extensive search functionality that you can use is Tweakwise. Tweakwise Navigator is a tool for e-commerce managers or webshop owners who want to control the ranking, search, navigation, and filtering in their webshop. Tweakwise can function in the background of any webshop and is ‘platform independent’. The great thing is that you do not need any technical knowledge to manage Tweakwise, which means that the entry-level is relatively low. Tweakwise is very good, but relatively expensive compared to Elasticsearch. So do your research beforehand into which search functionality you want to use and, if necessary, ask us for substantive advice.
8. Make use of Varnish Cache
Caching is a commonly used method to make websites and webshops function faster. The question is therefore not whether you should use caching, but which caching method you will eventually use.
For Magento, we recommend using Varnish Caching, among other things. Varnish is a reverse proxy that ensures that static pages are cached.
9. Update Indexes
Magento 2 is set by default to re-index products and categories automatically when updating a product or category. The problem with re-indexing is that it makes the environment a lot slower at the time of re-indexing. Instead of having Magento perform the re-indexing with an update, it is better to do this manually at a time of your choosing. You do this via the system menu and then go to index management.
Updating on schedule is a good option for performance. This is in contrast to updating the re-index on save with every product update. So in this case choose ‘Update By Schedule’.
You now have control over when you update the Magento index. It is wise to automate this process via a cron job, for example. But now you choose the time and day yourself, and therefore logically at a time when you have few visitors to your webshop.
10. Make use of Brotli Compression
The larger the web page is, the longer it takes to load. One of the ways to lighten the size of your web page is to enable Brotli and Gzip compression. The compression algorithm compresses web pages before sending them to the browser. This dramatically reduces transfer time as the files are much smaller. The reason compression works so well is that CSS files and HTML files use a lot of repeated text and have a lot of white space.
Because Brotli compresses commonly used strings, it can reduce the size of pages and stylesheets by up to 70%. Brotli and Gzip must be enabled on the web server, which is relatively easy. Of course, we arrange this as standard for all our customers at MagentoBrain. Because Brotli is not yet used by every browser, you should at least for the time being make sure that you use Brotli and Gzip in combination with each other.
11. Make minimal use of HTTP/2
Although HTTP/2 is already quite standard, it happens that older websites do not yet run on this new protocol. If HTTP/2 is enabled by your hoster and your shop also has an SSL connection, then this shop is automatically a lot faster. This allows you to achieve speed gains of up to 15% compared to the old HTTP protocol. HTTP/2 must be covered by all servers and networks. Are you unsure whether this is enabled for your webshop? Ask your hoster for more information. MagentoBrain customers naturally benefit from the standard HTTP/2 protocol in combination with an optional free SSL certificate.
12. Never use JS combining
In Magento 2 you have the option to enable JS bundling. This is a special feature of Magento to group JavaScript files together to reduce the number of HTTP requests. This is a useful feature if you are still running on HTTP version 1, but if you are already running (and we advise you to do so anyway) on HTTP/2, this feature adds nothing. Another reason that you should not enable this function is the fact that you will merge all JS files into one file, resulting in one large JS file. And loading one large JS file has an impact on the performance of your shop. So don’t go for JS bundling, but make sure you use HTTP/2 with Brotli and, for example, a CDN as described above.
You can check if JS bundling is disabled by going to the backend menu Stores > Configuration > Advanced > Developer:
13. Run your shop in production mode
You can run your Magento webshop in 3 different modes:
Standard (default) mode
This is the default mode if you installed Magento. You can use this best if you want to configure and test your Magento shop before putting it online for your visitors.
Developer modus
When you want extensive logging, look for bugs and make more in-depth configurations in your Magento store
Production mode
You use this mode for optimized performance. You want to use this as a standard and serve it to your visitors. This offers the best user experience for your visitors. The first two, standard mode and developer mode, are quite slow. So make sure that your webshop is set to production mode. This seems obvious, but in practice, we see that many (smaller) Magento webshops still struggle with this. You can put Magento in production mode by entering the following command:
php bin/magento deploy:mode:set production
14. Optimize your CSS
When you optimize CSS you make small performance optimizations. You can implement these settings in your Magento backend. Before you do this, don’t forget to put Magento in Developer Mode (and don’t forget to put it back into production when you’re done 😉). Run the following command via SSH to put Magento in developer mode:
php bin/magento deploy:mode:set developer
If the shop is in developer mode, go to Stores -> Configuration -> Advanced -> Developer and scroll to your CSS settings: Set both dropdown options to yes/yes and this will ensure that the CSS files are minified and merged. Save the settings and switch back to production mode.
Test your Magento webshop again
When you have implemented all or some of the above recommendations, it is of course interesting to see what effect they have had on the performance of your Magento shop. So have your webshop tested again by the tools we shared with you at the beginning of this article and you will have made significant profits. So you can do many things yourself. You can get even more detailed by optimizing your code. For this, you really need a developer who knows what he is doing. Because we believe that every Magento shop should have a performance that goes through the roof, we offer the ideal solution in terms of web hosting. Do not save on this at all, because a good partner such as a web host may provide the most speed.
The Ultimate Guide for Improving Magento 2 Speed
A slow webshop is no longer of this time. Many studies have shown that the slower the shop, the lower the conversion. And also search engines, but especially Google is punishing this more and more harshly. In short, every reason to go for ultimate speed performance. Especially when a lot of customization is added to the webshop and the maintainability of the code is also at stake, both the front end and the back end can sometimes feel slow. Both the visitor, the administrator, and the developer are of course not waiting for this and that is why we have written this extensive guide to significantly improve the speed of your Magento 2 webshop.
This manual is intended to get your Magento 2 webshop lightning fast and focuses on the entire application. With the aim of not only getting a fast frontend but also a fast backend. We were born from a Magento development agency and have built, maintained, and developed shops for years. In addition to security, our most important core value has always been performance.
We are happy to make this knowledge available to provide you with an even faster Magento webshop. This guide has been set up in such a way that you can do a lot yourself and where necessary you can easily enlist the help of a developer.
Magento speed optimizations will be discussed
In the end, we cover 14 optimization points:
- Update to the latest Magento 2 version
- Enable lazy loading for images
- Use a Content Delivery Network (CDN)
- Caching Options
- Remove unused plugins
- Choose a blazing fast web hosting
- Make use of a quick search functionality
- Make use of Varnish Cache
- Update Indexes
- Make use of GZIP Compression
- Make use of HTTP/2
- Never use JS combining
- Run your shop in production mode
- Optimize your CSS
Let’s start 😃.
Test the speed of your website/webshop
Before you start it is good to do a zero measurement. After all, only then will you know whether the optimizations you implement actually have an effect. Sites to measure the speed of your website are for example:
- GTMetrix
- Pingdom
- WebPageTest
We explain these and more tools in this blog article about testing the speed of your website. It is important to select a location that is as close as possible to the location of your data center/hosting provider. This paints the most realistic picture of your results.
One of the most important metrics here is the Time To First Byte(TTFB). This is a measuring instrument that provides insight into the response time of the web server. In fact, it says how much time it takes to receive the first data packet back from the web server. The lower the time the better this is. There are several ways to further lower the TTFB. For example, you can make a profit with Magento-optimized hosting, but there are also countless options for tackling this from within the application. For this, you need a good Magento developer. Of course, we advise you to score as well as possible on all metrics. It is therefore advisable to spend time on this. Start by forming a good image. Do this in a Google Spreadsheet so that you can make a good comparison after you have implemented speed optimizations from this article.
1. Update to the latest Magento 2 version
If you are running on an older version of Magento 2, you may not yet benefit from the optimizations that Magento and/or the community have made in the latest updates. A lot of attention is paid to the speed of Magento. This often includes performance optimizations that provide a direct speed gain for both the front-end and back-end. Please note: do not just update. Magento updates generally do not run smoothly and are not implemented at the touch of a button. So make sure you always have a backup and test it first on a test environment, for example.
It is also good to have a Magento developer who can provide support where necessary to quickly resolve issues that arise. Some things that have been greatly improved in recent updates:
- Response time of the catalog, search and advanced search pages have been significantly improved
- Product page gallery load optimization
- Improved page rendering through deferred loading and parsing of JavaScript
All other optimizations can be found on the Magento website.
2. Enable lazy loading for images
Images generally have a major impact on the speed of your website. Loading too many images at the same time on a page not only has a huge impact on the speed but also on your page speed scores. A best practice for not loading all those images at once is Lazy Loading.
With lazy loading, you ensure that images are only loaded when they actually appear. This means that the browser does not try to load the entire page at once, but instead prioritizes loading visible content. As the user scrolls to the bottom of the page, new content is loaded along the way. Lazy Loading first shows a lower-resolution image or a placeholder image, then immediately transfers it to the high-quality source image. To use Lazy Loading you can ask for help from a developer or, for example, use a (free) extension that handles this for you.
3. Use a Content Delivery Network (CDN)
A content delivery network (CDN) refers to a geographically dispersed group of servers that work together to provide fast delivery of online content. A CDN allows for the rapid transfer of resources required to load the content such as HTML pages, javascript files, stylesheets, images, and videos. (Source: Cloudflare). A properly configured CDN can also help protect websites against some common malicious attacks, such as DDOS attacks.
So using a CDN helps to improve the page load speed of your Magento shop, while also reducing your bandwidth consumption. A CDN has the most effect on performance if you actually get visitors from various countries on your website. We see that many webshops use the CDN that Cloudflare offers. So be sure to check out their website!
4. Caching Options
A fast webshop naturally requires well-set caching options. One way to optimize this is through Nginx configurations. For example, you can set how long the cache of certain file types may be kept. With a professional agency, the expiration time of many static files is already optimally set by default.
We will post an article regarding optimized Nginx configurations as a separate guide soon. Are you already interested in further optimizations? Then please contact us.
5. Remove unused plugins
If your webshop has been around for a while or if, for example, you do not have access to a good developer, it may be that you provide your Magento webshop with the necessary Magento plugins. It is of course nice that these plugins are available and you do not have to hire a Magento developer for many extra functionalities to functionally improve your webshop. However, there is also a disadvantage to installing plugins. They often have a negative influence on the performance of your webshop.
As far as plugins are concerned, the following really applies to us: less is more. The more functionality a plugin offers, the greater the chance of performance issues. Look for plugins that really do what you need, but certainly no more than that. So check on a regular basis whether you are still actively using plugins or whether they can be replaced by custom code or another optimization.
6. Choose lightning-fast Magento web hosting
A low-impact way to improve the speed of your Magento webshop is through well-optimized Magento hosting to choose from. The range here is large, but not every party actually offers Magento-optimized hosting. There are many different solutions ranging from large to small and it is important to choose the right package. Your Magento webshop needs good hosting to offer your users a good experience.
In addition, it is also important to handle various backend processes faster. Therefore, pay attention when selecting the right hosting package and especially look at the available resources. The most important resources are memory, CPU, and storage capacity. It is also important that you select hosting that not only gives you a fast connection, but also high-security standards and good support in case of downtime.
7. Make use of quick search functionality
For webshops, the search functionality is often one of the most important functionalities in the battle for high conversion. A fast search function is therefore a must. Magento has now made Dutch Elasticsearch the standard for search engines within Magento. This a great development that we absolutely welcome!
Another very extensive search functionality that you can use is Tweakwise. Tweakwise Navigator is a tool for e-commerce managers or webshop owners who want to control the ranking, search, navigation, and filtering in their webshop. Tweakwise can function in the background of any webshop and is ‘platform independent’. The great thing is that you do not need any technical knowledge to manage Tweakwise, which means that the entry-level is relatively low. Tweakwise is very good, but relatively expensive compared to Elasticsearch. So do your research beforehand into which search functionality you want to use and, if necessary, ask us for substantive advice.
8. Make use of Varnish Cache
Caching is a commonly used method to make websites and webshops function faster. The question is therefore not whether you should use caching, but which caching method you will eventually use.
For Magento, we recommend using Varnish Caching, among other things. Varnish is a reverse proxy that ensures that static pages are cached.
9. Update Indexes
Magento 2 is set by default to re-index products and categories automatically when updating a product or category. The problem with re-indexing is that it makes the environment a lot slower at the time of re-indexing. Instead of having Magento perform the re-indexing with an update, it is better to do this manually at a time of your choosing. You do this via the system menu and then go to index management.
Updating on schedule is a good option for performance. This is in contrast to updating the re-index on save with every product update. So in this case choose ‘Update By Schedule’.
You now have control over when you update the Magento index. It is wise to automate this process via a cron job, for example. But now you choose the time and day yourself, and therefore logically at a time when you have few visitors to your webshop.
10. Make use of Brotli Compression
The larger the web page is, the longer it takes to load. One of the ways to lighten the size of your web page is to enable Brotli and Gzip compression. The compression algorithm compresses web pages before sending them to the browser. This dramatically reduces transfer time as the files are much smaller. The reason compression works so well is that CSS files and HTML files use a lot of repeated text and have a lot of white space.
Because Brotli compresses commonly used strings, it can reduce the size of pages and stylesheets by up to 70%. Brotli and Gzip must be enabled on the web server, which is relatively easy. Of course, we arrange this as standard for all our customers at MagentoBrain. Because Brotli is not yet used by every browser, you should at least for the time being make sure that you use Brotli and Gzip in combination with each other.
11. Make minimal use of HTTP/2
Although HTTP/2 is already quite standard, it happens that older websites do not yet run on this new protocol. If HTTP/2 is enabled by your hoster and your shop also has an SSL connection, then this shop is automatically a lot faster. This allows you to achieve speed gains of up to 15% compared to the old HTTP protocol. HTTP/2 must be covered by all servers and networks. Are you unsure whether this is enabled for your webshop? Ask your hoster for more information. MagentoBrain customers naturally benefit from the standard HTTP/2 protocol in combination with an optional free SSL certificate.
12. Never use JS combining
In Magento 2 you have the option to enable JS bundling. This is a special feature of Magento to group JavaScript files together to reduce the number of HTTP requests. This is a useful feature if you are still running on HTTP version 1, but if you are already running (and we advise you to do so anyway) on HTTP/2, this feature adds nothing. Another reason that you should not enable this function is the fact that you will merge all JS files into one file, resulting in one large JS file. And loading one large JS file has an impact on the performance of your shop. So don’t go for JS bundling, but make sure you use HTTP/2 with Brotli and, for example, a CDN as described above.
You can check if JS bundling is disabled by going to the backend menu Stores > Configuration > Advanced > Developer:
13. Run your shop in production mode
You can run your Magento webshop in 3 different modes:
Standard (default) mode
This is the default mode if you installed Magento. You can use this best if you want to configure and test your Magento shop before putting it online for your visitors.
Developer modus
When you want extensive logging, look for bugs and make more in-depth configurations in your Magento store
Production mode
You use this mode for optimized performance. You want to use this as a standard and serve it to your visitors. This offers the best user experience for your visitors. The first two, standard mode and developer mode, are quite slow. So make sure that your webshop is set to production mode. This seems obvious, but in practice, we see that many (smaller) Magento webshops still struggle with this. You can put Magento in production mode by entering the following command:
php bin/magento deploy:mode:set production
14. Optimize your CSS
When you optimize CSS you make small performance optimizations. You can implement these settings in your Magento backend. Before you do this, don’t forget to put Magento in Developer Mode (and don’t forget to put it back into production when you’re done 😉). Run the following command via SSH to put Magento in developer mode:
php bin/magento deploy:mode:set developer
If the shop is in developer mode, go to Stores -> Configuration -> Advanced -> Developer and scroll to your CSS settings: Set both dropdown options to yes/yes and this will ensure that the CSS files are minified and merged. Save the settings and switch back to production mode.
Test your Magento webshop again
When you have implemented all or some of the above recommendations, it is of course interesting to see what effect they have had on the performance of your Magento shop. So have your webshop tested again by the tools we shared with you at the beginning of this article and you will have made significant profits. So you can do many things yourself. You can get even more detailed by optimizing your code. For this, you really need a developer who knows what he is doing. Because we believe that every Magento shop should have a performance that goes through the roof, we offer the ideal solution in terms of web hosting. Do not save on this at all, because a good partner such as a web host may provide the most speed.
