This all-inclusive guide will cover all the crucial Magento 2 speed optimization steps and methods.
Presumably, website speed or page speed is one of the most critical factors when it comes to ranking on search engines. A par excellent page speed means a higher probability of ruling the top spot of the search engine result page.
Magento is undeniably one of the most sought-after and most-efficient e-commerce platforms which are extensively used by merchants across the world. This platform is specifically designed to serve a plethora of merchants and users at once.
However, whenever the number of users increases on the platform expeditiously, a website speed begins to slow down. And, a terrible website speed for users is no less than a heinous crime in the eyes of all search engines. So, the key question arises here is how to speed up Magento 2 website and save your website rankings to go nose down in the search engine result page?
To sway away all your worries related to slow the performance of the prevailing Magento 2 store, we have created an all-inclusive Magento 2 speed optimization guide that comprises all the methods a merchant could ask for to amply to do Magento 2 performance speed optimization.
Table of Content
- 1. Optimize JavaScript Code and CSS
- 2. Image Optimization
- 3. Remove Unused Attributes and Unwanted Modules in Magento 2
- 4. Use Lazy Loading for Images
- 5. Enable Magento 2 Cache
- 6. Activate Varnish Cache Tool
- 7. Conduct Server Side Checkups
- 8. Enable Flat Catalog in Magento 2
- 9. Enable Gzip Compression
- 10. Fix Up .htaccess Caching Options
- 11. Induce Cacheable Blocks in Magento 2
- 12. Use CDN to Boost Up Content Delivery
- 13. Use HTTP/2 instead of HTTP/1
- 14. Activate Production Mode to Boost Magento 2 Speed
- 15. Configure Redis Cache
- 16. Clean up Unnecessary Database Logs
- 17. Analyze Page Performance with Magento Profiler
- 18. Enable HTML Minification
- 19. Optimize Your Magento 2 Store Theme and Media
- 20. Add Elastic Search to Boost Search Results
Magento 2 Speed Optimization Steps
1. Optimize JavaScript Code and CSS
It’s a well-known thing that if your website is built on Java-script, jQuery. Ready will load all its functions first instead of rendering meaningful content to the users. This will expeditiously enhance the page load timing and create an obsolete user-experience. However, there is a seamless solution to this problem.
You can avoid running non-critical JS code in. ready () and balance the JS code load and content delivery timing equally. You can balance the load by using
$(window).ready() and $(window).load().
There are two other ways to speed up Magento 2 by optimizing Javascript: timeouts and intervals. You can divide a hefty JavaScript code into small parts and with minimal interval. You can utilize the command setInterval (Func, delay) and setTimeout (Func, delay) to break the lanky JS codes into smaller bits and minimal loading interval.
2. Image Optimization
A typical E-commerce store on Magento 2 platform comprises thousands of product images that are of high definition and chunky in size. Too many heavy size images on the website can slow down the website speed to a great extent. One of the effective ways to increase Magento 2 speed is by compressing all the prevailing images. Doing this will significantly improve the page load speed. Another method is to use next-generation format images like JPEG XR, JPEG 2000, Webp which have 40% faster loading time than traditional image formats.
3. Remove Unused Attributes and Unwanted Modules in Magento 2
One of the easiest ways of Magento 2 speed optimization is removing unused attributes and unwanted modules in Magento 2 platform. Disable all the unused attributes and unwanted modules that are causing a drastic increase in page load timing. You can disable a module and remove trivial attributes by using the commands mentioned below.
Command for removing unused attributes:
php bin/magento catalog:product:attributes:cleanup
Command to Disable a Module:
bin/magento module:disable Magento_Marketplace
4. Use Lazy Loading for Images
In recent times, Google suggested website owners to use lazy loading attribute if their website encloses a colossal number of high definition and chunky images. The concept of lazy loading is quite simple, easy to implement, and can speed up Magento 2 website by leaps and bounds.
According to the concept of lazy loading, only those images will be loaded which are showing in above the fold part of the website. As users scroll the bottom of the page, new content (including images and texts) will get loaded. This will automatically boost up your Magento 2 site speed. For the Magento 2 instance, implementing lazy loading will reap several benefits:
- Expeditious page load speed and unruffled user-experience.
- Better from an SEO point of view.
- Saving of bandwidth space as not all users scroll to the bottom of the page.
5. Enable Magento 2 Cache
You can solve the Magento 2 speed optimization problem to a great extent by enabling cache in Magento 2 platform. At backend configuration, you can enable the cache within a split of a second.
Login to the Magento 2 admin and go to –
system > Cache Management
You can check the cache status in the admin panel itself. You will find numerous green icons in front of Cache types.
6. Activate Varnish Cache Tool
Before you implement this step to increase Magento 2 speed, it is imperative to know what Varnish tool is about and its attributes.
The varnish is a highly efficacious caching tool that creates a subtle layer between users and the webserver. On a frequent basis, it will cache all those files into RAM that are often requested by users. When you implement the Varnish cache tool, it will bring up requested files in a blink of an eye. Users don’t have to wait for page load anymore.
To fully reap the benefits of the Varnish cache tool, combine it with CDN. The added Content delivery network will cache all the prevailing content (text + images) and boost your Magento 2 e-commerce store speed. Before you implement the Varnish cache tool, there are various considerations you must keep in mind.
- Content with undefined TTL
- The amount of cacheable= false blocks
The major reasons behind rendering these considerations are; first, Varnish doesn’t cache content with undefined TTL and still fetch content from your web server. Therefore, before implementing the Varnish cache tool, we recommend you to run the test on the separate Magento instance to check the platform’s stability and check how much Varnish is contributing in Magento 2 speed boost up.
7. Conduct Server Side Checkups
Here is the pointer which most of us often neglect when considering factors for Magento 2 speed optimization.
Though a cloud server with 2GB RAM/ 2vCPU server is more than sufficient, however, we recommend you to choose 8GB RAM/ 4Vcpu server.
8. Enable Flat Catalog in Magento 2
The data and products in Magento 2 instance are stored through an entity attribute model. So, for the colossal number of products and data, there is an equal number of entity attribute models. The gargantuan number of attribute models dwindle the store speed and render tacky user-experience.
However, when you enable a flat catalog attribute in Magento 2, all your products and other data get consolidated in one place and responds to MYSQP query way faster than ever.
Below, we have given steps to enable a flat catalog in Magento 2.
- Go to stores> settings >configuration section in the admin panel
- Under the catalog section, select catalog on the left panel
- Open the storefront section
- Click on “Yes” and use flat catalog product fields
- Click on Save configuration button to save changes
9. Enable Gzip Compression
Those who don’t know, Gzip is a software application used for compressing or decompressing files.
When you enable Gzip compression to speed up your Magento 2 website, it will compress all the pages prevailing on your website and speed your Magento 2 e-commerce performance manifold times. Enabling Gzip compression drastically reduces Time to First Byte and server response time. For example, if your page size is 128 KB, Gzip compression will compress your page and send it to the browser with size 30-40 KB.
Gzip compression is the easiest to implement. All you have to do is make sure it is compatible with your Magento 2 platform or not?
10. Fix Up .htaccess Caching Options
Undeniably, .htaccess is one of the most critical elements which hold server information that could be utilized to speed up Magento 2 performance.
11. Induce Cacheable Blocks in Magento 2
You can make Magento 2 performance speed optimization task a lot easier task by adding Cacheable blocks in Magento 2. We all know that Magento 2 block is a non-cacheable entity, and all blocks are non-cacheable.
You can exterminate the cache problem by identifying incorrect cacheable blocks and fix them in no time. To find Magento 2 blocks, you need to access layout files which you will find in the below-mentioned folders.
app/design/frontend/[Package]/[Theme]/[Module]/layout/*
app/code/[Company]/[Module]/view/frontend/layout/*
vendor/[company]/[module]/view/frontend/layout/*
12. Use CDN to Boost Up Content Delivery
Using an efficient content delivery network is one of the best ways to speed up your Magento 2 website and provide exceptional user-experience. CDN creates a cache of your website files on different remote servers and serves content as swiftly as possible as per their location. No matter which hosting your Magento 2 store is hosted, all of your users can excess your Magento 2 store at the same speed.
However, there is one condition that you should be aware of. You can reap the maximum benefits of CDN only if your Magento 2 store is installed on-premise and not on the cloud.
13. Use HTTP/2 instead of HTTP/1
Google recently released the new networking protocol HTTP2 which is way more efficient, robust, and significantly faster than HTTP 1. Currently, it is the most useful and sought-after Internet protocol.
There are gargantuan benefits of using the HTTP/2 protocol for your Magento 2 website.
- Highly compatible with all HTTP status codes, headers, and header fields.
- Increases Magento 2 website speed manifold times.
- HOL blocking – Package blocking
- Binary protocol
- HTTP/2 server push
If you shift your Magento 2 platform on HTTP/2 protocol, it will work parallel on a single connection, compress all headers, and take your Magento 2 website speed notches higher.
14. Activate Production Mode to Boost Magento 2 Speed
Most of the merchants don’t know that Magento 2 can operate on 3 modes namely: default mode, developer mode, and the production mode. Out of three modes, the default and developer modes are solely used for debugging purposes instead of on the live website.
Production mode is purely used for deployment purposes in the production system. Moreover, it renders static view files from Cache. When you enable production mode in Magento 2, it prevents automatic code file compilation and doesn’t allow you to enable or disable cache types in Magento 2 admin.
To enable the Production and speed up Magento 2 platform performance, follow the command given below.
<code”>php bin/magento deploy:mode:set production
15. Configure Redis Cache
Just for the information purpose, Redis is an open-source data structure store used as a cache, database, and message broker. There is a way to augment Magento 2 performance speed optimization by configuring the Redis cache in Magento 2 instance.
Configuring Redis cache in Magento 2 enhances website stability and speed, optimize Magento 2 storage, and enables disk-saves.
There are two methods to configure Redis cache in Magento: Manual and automatic.
Method 1: Configuring Redis Cache for Magento 2 through the Command Line
Run the command given below to enable Redis backend caching for Magento 2.
How Utilizing PWAs in Magento are Useful for Merchants?
There are gargantuan benefits of using PWAs in your Magento e-commerce store. Let’s review the key benefits one at a time.
cd /data/web/magento2
bin/magento setup:config:set --cache-backend=redis --cache-backend-redis-server=127.0.0.1 --cache-backend-redis-db=0
After running the command, you should configure Redis Cache for Magento 2 by doing editing in env.php file. Use the command mentioned below to enable caching in Redis.
/data/web/magento2/app/etc/env.php
Now, add this snippet in between the cache keys.
'cache' => array(
'frontend' => array(
'default' => array(
'backend' => 'Cm_Cache_Backend_Redis',
'backend_options' => array(
'server' => '127.0.0.1',
'port' => '6379',
),
),
),
),
Last but not the least, flush your cache.
rm -rf /data/web/magento2/var/cache/*
redis-cli flushall
Configuring Redis Full Page Caching for Magento 2
To configure Redis full page caching manually, extend /data/web/magento2/app/etc/env.php with the following snippet.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
‘cache’ => array ( ‘frontend’ => array ( ‘default’ => array ( ‘backend’ => ‘Cm_Cache_Backend_Redis’, ‘backend_options’ => array ( ‘server’ => ‘127.0.0.1’, ‘port’ => ‘6379’, ), ), // Start of snippet ‘page_cache’ => array ( ‘backend’ => ‘Cm_Cache_Backend_Redis’, ‘backend_options’ => array ( ‘server’ => ‘127.0.0.1’, ‘port’ => ‘6379’, ‘database’ => ‘1’, ‘compress_data’ => ‘0’, ), ), // End of snippet ), ), |
Then Flush your cache:
rm -rf /data/web/magento2/var/cache/*
redis-cli flushall
Flush Magento Cache:
You should clear the prevailing Redis database for the configured Redis database.
redis-cli -n $db flushd
Or you can also utilize the Magento CLI tool to flush cache.
Flush Using Magento CLI:
cd /data/web/magento2 && php bin/magento cache:flush
16. Clean up Unnecessary Database Logs
If your Magento 2 store is running for a long time, unwanted database logs grow exponentially and keep gathering until you clear it. The gargantuan amount of database logs dwindles the website and diminish your Magento 2 e-commerce store overall performance.
Cleaning your cluttered database logs is one of the easiest and best ways for Magento 2 speed optimization without much of a hitch. However, when it comes to cleaning unnecessary database logs, Magento 1 has an upper hand over Magento 2 as Magento 1 has a clear option to eradicate garnered database logs.
To clean up the database logs in Magento 2, access to PHPMyAdmin panel and clean the logs manually.
17. Analyze Page Performance with Magento Profiler
Not many merchants and developers know that there is an in-built analysis tool in Magento 2 instance named Magento profiler that can give you a comprehensive analysis of your page performance. With Magento profiler at your disposal, you can collect data like event logs, page loads, study dependencies, and the list goes on.
Open .htaccess file and induce the following command to activate the Magento profiler tool.
SetEnv MAGE_PROFILER csvfile
And, if you want the Magento profiler to render feedback on the same screen, use the command given below instead of the above-mentioned one.
SetEnv MAGE_PROFILER html
Apart from enhancing the Magento 2 platform speed, the Magento profiler can be used for finding other critical issues that can hamper website performance.
18. Enable HTML Minification
Minification of HTML files and codes is a sure-fire way to speed up Magento 2 platform performance and make your website more expeditious than ever. Minifying HTML will reduce code clutter, remove unwanted developer comments, and various other things.
Enter the developer mode to minify the HTML codes in no time.
Find Stores > Configuration > Advanced > Developer > Template Settings.
19. Optimize Your Magento 2 Store Theme and Media
Undeniably, there are numerous drawbacks of using a chunky theme and media for your Magento 2 store. Not only big size themes and media consume a lot of bandwidth but also they bring down website speed beyond your expectations.
One fine way to deal with this issue is using the lightweight theme and media for Magento 2 performance speed optimization. Over time, a theme becomes old and loaded with accumulated with numerous updates. So, installing the new, lightweight, and responsive theme gives you an upper hand over others.
Done with the theme optimization? What about image optimization?
Media comprises a huge chunk of the overall website data and should be optimized well in order to let your store run efficiently. To optimize media thoroughly, you can harness the following pointers.
- Compress all the media on your website.
- Use next-generation image formats like JPEG XR, JPEG2000, WEBP, etc.
- Use CDN that delivers image content speedily.
20. Add Elastic Search to Boost Search Results
There is only one and one thing that users want and expect whenever they visit any website, fast results of their queries. Appending Elastic search in your Magento 2 store is one of the best ways to deliver quick results to users whenever they hop on your website and search for anything.
Elastic search is packed with advanced functionalities, render multi-language support, and other attributes that make it a reliable search option.
First, install elastic search and then turn it on in your Magento 2 Admin panel.
Stores > Settings > Configuration > Catalog > Catalog > Catalog Search.
Here we conclude the post and hope you will find all the above-mentioned pointers useful. For Magento 2 speed optimization, you will need the expertise of certified Magento 2 developers who can boost your Magento 2 platform’s performance and stability, and enrich website user-experience.