Did you ever imagine that speeding up your Magento 2 website can give you million bucks conversion? Most of us who are running eCommerce website on Magento 2 is suffering from the slow Magento 2 speed issue, not only this, many times we have faced high bounce rate and due to this ultimately we end up losing our potential customers.
The below given Magento 2 speed steps gives the utmost benefits to Magento 2 developers and Magento 2 store administrator.
Magento 2 Speed:
Magento 2 is the open-source platform launched as upgradation of Magento in 2015.
Speed plays a crucial role in Magento 2 store, but there are many reasons which can join forces to slow down your website performance as well as speed, some of which includes:
• Slow hardware
• Third-party extensions
• Disabled full page cache
• Un-minified JavaScript and CSS files
• Disabled Flat Catalog
• JS bundling
Now, when we know the reason behind slow Magento 2 speed, we have to jailbreak them and discover ways to speed up your Magento 2 website. Here are few tips that will surely fuel up your Magento Stores:
1. Enable Magento 2 Cache:
Most of the Magento 2 store speed problems can be solved if you can enable the cache from Magento 2 backend configuration.
Login into the Magento 2 admin page and go to
System > Cache Management
Enable the cache. Once you enable the Magento 2 cache, you will find green icons showing enable status in front of cache types, so next time when you visit the page, it will load faster than before.
Enable Production mode in Magento 2:
Magento 2 works on three modes, namely: Default, Developer, and production. In which default and developer modes are used for debugging purpose instead of the live website. When the website uses these modes, the engine uses a PHP script to process all the static data.
Production Mode: This mode is used for the deployment in the production system,
Does not show exceptions to the user (exceptions are written to logs only).
Serves static view files from cache only.
Prevents automatic code file compilation. New or updated files are not written to the file system.
Does not allow you to enable or disable cache types in Magento Admin. More information about enabling and disabling the cache:
Login through SSH if you have the hosting details and switch the mode, use the following command:
php bin/magento deploy:mode:set production
3. Merge and Minify CSS and JS in Magento 2:
Minify JS and CSS files without using the 3rd party extensions. Along with this, you can merge all CSS and JS files into one consolidated file. After merging the files, you will see a noticeable change in page speed.
Login in Magento 2 admin
Go to Stores > Configuration > Advanced > Developer and set minification on:
The solution for Merging CSS in Magento 2
· On the Admin panel, click Stores. In the Settings section, select Configuration.
· Select Developer under Advanced in the panel on the left
· Open the CSS Settings section,
· In the Merge CSS Files field, select Yes
When complete, click Save Configuration.
Solution to merge JavaScript files in Magento 2
- On the Admin panel, click Stores. In the Settings section, select Configuration.
- Select Developer under Advanced in the panel on the left
- Open the JavaScript Settings section and continue with following:
- In the Merge JavaScript Files field, select Yes
- When complete, click Save Configuration.
Do not forget to deploy your Magento 2 static content and flush Magento 2 cache using following commands;
php bin/magento setup:static-content:deploy
chmod 777 -R var pub generated
php bin/magento cache:flush
Enable Flat Catalog in Magento 2:
Magento 2, uses an entity attribute model to store the data and products. When you enable flat catalog category and product, data get combined into one, and further, it also responds to MYSQL Queries much faster.
Solution: Enable Magento 2 flat catalog category and product by below steps:
Login to Magento 2 back-end
- Navigate to the Stores > Settings > Configuration section in your admin panel.
- Select Catalog on the left panel, under the Catalog
- Open the Storefront section
- Choose "Yes" at the Use Flat Catalog Category and Use Flat Catalog Product fields.
- Press the Save configuration button to save the changes.
Indexing in Magento 2:
An indexer is one
of the important features in Magento 2 indexing. These are the following
indexers in Magento 2
- Category products
- Product categories
- Product price
- Product entity attribute value
- Stock
- CatLog rule product
- CatLog product rule
- CatLog search
Login
through SSH if you have the hosting details and switch the mode, use following command:
Use this command to reindex all or
selected indexers one time only.
php
bin/magento indexer:reindex all
OR
php
bin/magento indexer:reindex design_config_grid customer_grid
php
bin/magento indexer:reindex catalog_category_product
php
bin/magento indexer:reindex catalog_product_category
php
bin/magento indexer:reindex catalog_product_price
php
bin/magento indexer:reindex catalog_product_attribute
php
bin/magento indexer:reindex catalogsearch_fulltext
php
bin/magento indexer:reindex cataloginventory_stock
php
bin/magento indexer:reindex catalogrule_rule
php
bin/magento indexer:reindex catalogrule_product
5. Add Cacheable blocks in Magento 2:
Magento 2 block is non-cacheable (for block cache) if cache_lifetime of the block is not set to a number greater than 0. By default, all blocks are non-cacheable.
Use when the block: Has dynamic content and is unlikely to be rendered with equal content several times is used only as a child of a cacheable block in layout hierarchy.
To fix this cache problem, you need to find incorrect uncacheable blocks and remove or fix them.
Magento 2 blocks are defined in the layout files, which are placed in the following folders:
app/design/frontend/[Package]/[Theme]/[Module]/layout/*
app/code/[Company]/[Module]/view/frontend/layout/*
vendor/[company]/[module]/view/frontend/layout/*
6. Disable unwanted Modules in Magento 2:
Try to disable the un-used modules, because excess modules increase the load time of the Magento 2 website page, results in low performance of the website.
Solution: The default way to disable a module:
bin/magento module:disable Magento_Marketplace
However, if the module file is still there it can be enabled again in some circumstances,
7. Remove unused attributes in Magento 2:
If your website is large, it is mandatory that you should clean section in frequent interval of time.
Solution: You can remove unused product attributes in Magento 2 by using the command line:
php bin/magento catalog:product:attributes:cleanup
8. Server Side Check-ups:
Before implementing everything, you should check your server specification, to start, a basic cloud server with (2GB RAM/2 vCPUs) is sufficient, but we recommend you to choose 8GB RAM/4 vCPU SERVER.
9. Use advanced JS Bundling in Magento 2:
Don’t use default JS bundling, we recommend you to use advance JS bundling. Doing default JS bundling would create huge 5-10 Mb files with all the JavaScript codes. These big files can negatively impact page load time.
On the other hand, advance JS bundling enable you to build bundle so that each page of the store will only need to download a common bundle and a page-specific bundle for each page accessed.
You can achieve this by defining your bundles by page types, including category, Product, CMS, Customer, Cart, and Checkout. Each page categorized into one of these page types has a different set of RequireJS module dependencies. When you bundle your RequireJS modules by page type, you will end up with only a handful of bundles that cover the dependencies of any page in your store.
You could also create bundles by purpose: for common features, product-related features, shipping features, checkout features, taxes, and form validations.
A clean Magento 2 installation allows reaching enough good performance by splitting bundles by page types, but some customization may require deeper analysis and other asset distributions.
JavaScript bundling reduce two things first is the number of server request and second is size of the server request.
Solution:
Required tools for Magento 2 advance JS bundling
The following steps require you to install and have familiarity with the following tools:
nodejs
r.js
PhantomJS
10. Redis for Magento 2:
Redis is a caching methodology which increases the speed of your Magento 2 store, by working on backend and frontend. We suggested you to install and use Redis for cache and sessions.
Solutions : Configure Redis cache for Magento 2
There are two ways to configure Redis Cache for Magento 2. You can either run a command which automatically updates the env.php with the correct details or you can manually change the env.php file
Configure redis cache for Magento 2 through the commandline
Use the following command to enable Redis back-end caching:
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
Configure redis cache for Magento 2 by editing the env.php file
To enable caching in Redis, extend your /data/web/magento2/app/etc/env.php with the following snippet. Add this in between the cache keys. (Without the cache key in the snippet)
'cache' => array(
'frontend' => array(
'default' => array(
'backend' => 'Cm_Cache_Backend_Redis',
'backend_options' => array(
'server' => '127.0.0.1',
'port' => '6379',
),
),
),
),
Now flush your cache:
rm -rf /data/web/magento2/var/cache/*
redis-cli flushall
Configure full page caching for Magento 2
To enable page caching Redis, extend your /data/web/magento2/app/etc/env.php with the following snippet.
You should paste this in between the cache keys, so leave the cache tag in this snippet out of it.
'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
),
),
And flush your cache:
rm -rf /data/web/magento2/var/cache/*
redis-cli flushall
Flush Your Cache
To flush your Magento cache, clear the Redis database corresponding to your configured Redis database:
redis-cli -n $db flushdb
Or alternatively use n98-magerun2 or the Magento cli tool:
## Flush using n98-magerun2
n98-magerun2 cache:flush
## Flush using magento cli
cd /data/web/magento2 && php bin/magento cache:flush
To flush all sessions, caches etc (flush the full Redis instance), use the following command:
redis-cli flushall
Conclusion: There are a plethora of things which can be done to increase the Magento 2 speed. The above tips can increase your Magento 2 store speed to the highest. If you are a non-technical person, implementing these tips can be a complete pain for you. For this we recommend you to hire a professional Magento 2 development company who have core knowledge of Magento 2 and can provide you high-end Magneto 2 services.
Citation: (Source)
https://devdocs.magento.com/guides/v2.3/performance-best-practices/advanced-js-bundling.html
https://servebolt.com/articles/speed-up-magento-2-in-7-easy-steps/
https://magenticians.com/magento-optimization/
https://support.hypernode.com/knowledgebase/configure-redis-magento2/
