category oscprofessionals - Blogs - Best 10 Steps for Magento Speed Optimization

Best 10 Steps for Magento Speed Optimization

1. Magento speed optimization

Magento speed optimization is the step every Magento store owner should take when the traffic hits, bounce rate rises and there is no increase in conversion rates. and all this because website performance is a vital factor that influences not only Magento SEO and traffic but purchasing decisions as well.
Speed is the most important factor of any online store.
Speed impact on various aspects :
  • Customer satisfaction
  • Conversion rates
  • SEO ranking
  • PPC cost or social media Ad cost ( Adwords and Facebook).

2. Magento performance optimization

Performance based on how to optimize your website, so we can apply all the opportunities to speed up the website. apply to optimize images and use a CDN if possible. enabling gzip compression will also decrease the size of the files to be downloaded. Using elastic search will increase the speed of your catalog pages and the search results page will load much faster.
Performance Results:
Before
10-steps-1
After
10-steps-2

3. Magento Page Speed

4. Steps for Magento Speed Optimization

4.1 Use CDN (Content Delivery Network)
A Content delivery network (CDN) is used to store media files. Content Delivery Networks are the preferred means to serve images for your online store. A Content Delivery Network distributes your images over a secure network of servers around the world.
Magento supports default CDN, you need not install any third-party extensions.
Identification for CDN
Tools like GtMatrix
10-steps-3
How does it work ?
1. When customers open stores in the browser, the browser requests the media that is specified in the HTML.
2.The request is sent first to the CDN. If the CDN has the images in storage, it serves the media files to the customer’s browser.
If the CDN does not have the media files, the request is sent to the Magento web server. if the media files are found in the file system, the web server sends them to the customer’s browser.
CDN configuration for magento speed optimization
Open backend of your site
Store > settings > configuration > General > web
=>Expand the base URLs section and do the following
-Update the Base URL for Static View Files with the URL of the location on the CDN where static view files are stored.
Update the Base URL for User Media Files with the URL of the JavaScript files on the CDN. Both these fields can be left blank, or can start with the placeholder: {{unsecure_base_url}}.
10-steps-4
=>Expand the base URLs (Secure) section and do the following
-Update the Base URL for Static View Files with the URL of the location on the CDN where static view files are stored.
-Update the Base URL for User Media Files with the URL of the JavaScript files on the CDN. Both these fields can be left blank, or can start with the placeholder: {{unsecure_base_url}}
-Once you fill in these details click on Save Configuration.
10-steps-5
CDN Services :
  • Load time of website improvement.
  • Cost of bandwidth reduction.
  • Content availability and redundancy of websites are increasing.
  • Improving website security.

4.2 Enable Varnish cache

Varnish is a common caching tool for Magento. varnish is a proxy server. It is useful to deliver content fast. when a visitor requests your site, then this request will not be sent to magento, it’s delivered from cache.
Varnish checks if visitors request for:
  • Home page
  • Catalog page
  • CMS pages
Magento varnish configuration
1. Stores > Configuration > Advanced > System > Full Page Cache
2. From the Caching Application list, click Varnish Caching
10-steps-6

4.3 Merge and Minify JS/CSS

The next step you need to follow is merging and minifying CSS and JavaScript files, that means making the web page as light as possible for the fast loading. Please put magento into production mode.
./bin/magento deploy:mode:set production
Merge and Minify JS configuration
Go to Backend > Stores > Configuration > Advanced > Developer > Javascript Settings
10-steps-7
Merge and Minify CSS configuration
Go to backend stores > Configuration > Advanced > Developer > CSS settings
10-steps-8

4.4 Flat Catalog

Enable flat catalog to speed up that flat catalog allows offloading the number of the database once there is any request for showing the product.at the same time, MySQL query complexity will be reduced.
Flat catalog configuration
Go to Backend > Stores > Configuration > Catalog > Catalog> Storefront
10-steps-9

5. Page cache

Cache is a small amount of memory which is a part of the CPU – closer to the CPU than RAM . It is used to temporarily hold instructions and data that the CPU is likely to reuse. A cache is a special storage space for temporary files that makes a device, browser, or app run faster and more efficiently.
Page cache configuration
Open your Magento admin > System > Cache management
10-steps-10

Magento enable full page cache command lines

=>To enable all cache using Magento command line, enter the following
php bin/magento cache:enable
=>To disable the cache
php bin/magento cache:disable
=>To clean the Magento cache
php bin/magento cache:clean
=>To flush the Magento cache
php bin/magento cache:flush

Magento Clear Cache and Flush Cache Configuration

So basically here is the method for clear the cache:
i) Admin setting
Admin > System > Cache Management
10-steps-11

5.1 Image Optimization

Image optimization is the process of creating and delivering high-quality images in the ideal format, size, and resolution to increase user engagement and resolution. Compressing images should be done before submitting an image. You can use JPEG format for product images and PNG or SVG for the layout as well as the logo.
Below are the steps for the optimization of images:

5.2 Upgrade to the latest version of Magento

The advanced functionalities and speed is updating to the latest version.it gives you a strong recommendation to upgrade to the latest version to boost the store’s speed.
Steps to update Magento:-
  • Firstly Backup your store
  • Store in maintenance mode
  • Upgrade to magento
  • Check also the current version of Magento

5.3 Javascript Bundling

Bundling Javascript modules for better performance is about reducing two things:
– The number of server requests.
– The size of those server requests.

Follow below the test cases

i) Backend > Stores > Configuration > Advanced > Developer > Javascript settings
– Merge Javascript file: No
– Enable JS bundling: Yes
– Minify JS files : No
– Move JS code to bottom : Yes
10-steps-12
ii) Backend > Store > Configuration > Amasty extension > Google Page Speed optimizer > settings > JavaScript setting
– Amasty JS optimization : Enable
– Is Magento Cloud : No
– Run optimization option and follow all steps
– Click on save config button
10-steps-13
iii) From CLI
– Set store mode as production
– Run full deployment
– Clear all cache and set all permissions

Command lines for the bundling

– To enable Magento’s built-in bundling from the command line
$ php -f bin/magento config: set dev/js/enable_js_bundling 1
– To enable Magento’s built-in merging from the command line
$ php -f bin/magento config:set dev/js/merge_files 1

5.4 Magento Hosting

Magento is a powerful eCommerce platform with various tools that start your business in a minimum time, hosting isn’t included in the package for those using Magento Open Source. Therefore, the solution is to find a hosting provider for your website.it helps you to grow your site performance and security.
The most important features of a hosting:
  • Compatibility
  • Security
  • Speed
  • Server location
  • Support

5.5 Optimize TTFB (Time to First Byte)

There are a number of things which are causing a higher TTFB. If you are noticing that your page is taking a long time to first byte, then it is important to investigate the issue and make any necessary changes in order to optimize your site’s speed. Below given some of the common reasons why you have higher than normal Average TTFB
We are intentionally stating average TTFB as this is ignored but in the real world we shall focus on this( check google analytics you will get average server response time which can be considered as a parameter directly related to TTFB)
  • Page not delivered from Varnish Cache ( Magento / Adobe recommends Varnish as a must-have )
  • Varnish configured but due to improper coding varnish is by passed( some block cacheable set to false or cache life is less or almost 0 or VLC code results in bypass )
  • Networking issues
  • Poorly configured web server
  • Database configuration/design
  • Slow DNS response time
  • Server to be in user Proximity
  • Load balancing
  • Crons consume too many resources so this would mean that the server does not have sufficient resources to efficiently handle requests.
  • Backend activities that are resource-heavy are being done during peak load time.
  • Some modules are consuming resources due to improper coding.
  • Huge collections to be displayed on a page. This would mean intensive SQL queries when collection is not in cache.
  • Call to very specific layered navigation that can’t be cached.
  • Too much log creation.
  • XHR and UI components not used effectively.
  • Unwanted blocks and modules were called on the page.
  • Use of some third party modules that hook to the page.
10-steps-14

Conclusion

The above tips and tricks will help you out with speeding up your Magento store. However, there are various ways to speed up your store performance.

Check more blogs to speed up your site. It may help you.

Latest Posts

Leave A Comment