Magento 2 Performance Optimization

magento-2-tutorial
performance
optimization

For Magento 2 stores, Magento 2 Performance Optimizing is one of the important factors to lead your work more successful. Remember that if you want to keep customers stay longer with you if you bring the great experience during the time they spent on your site. Thus, a fast online store is the ideal one that is more friendly with many visitors as you expect instead of a bad performance of the website. Only when your store is closer to the consumers, increasing conversion rate as well as optimizing the revenue become easier and easier.

According to Benchmark Testing, that makes the comparison between out-of-the-box supported and recommended configurations for Magento Enterprise Edition 2.0 and Magento Enterprise Edition 1.14.2. The test proved that Magento 2.0 is considered as the greater platform than Magento 1.x through all metrics and use cases. With Magento ver.2, you will handle the surprise results:

  • Process up to 39% more orders per hour
  • Deliver nearly instant server response times for catalog browsing
  • Enable up to 66% faster add-to-cart server response times
  • Provide up to 51% faster end-to-end checkout times

Nowadays, when the awareness of Magento 2 performance is widespread, many additional technologies are integrated to support Magento 2 performance optimizing such as Varnish, Redis, Nginx and even full page caching solution. Thanks to the existing tools, it is simple for the development team to start the decoupling of functionality, then upgrade new levels of flexibility with the stable compatibility and operability among components. That is the great idea to design the better interface both in the server response time but also in the browser side rendering speeds. After all, you will get big step changes of improving Magento 2 performance and enhance customer experience at your store.

How to Optimize Magento 2 Performance

As a normal eCommerce page, it takes more than 3s to load a product page. Do you think it is so annoying if your customers need to browse through five similar pages at your website? Of course, they will be never patient to wait for the delay. Please keep your eyes on this post and find the relevant method to speed up the site performance.

Steps to Optimize Performance

  • Step 1: Enable Flat Categories and Products
  • Step 2: Merge CSS and JS Files
  • Step 3: Content Delivery Network
  • Step 4: Caching
  • Step 5: Image Optimization
  • Step 6: Enable Compression
  • Step 7: Reduce Server Response Time
  • Step 8: Magento Updates

Firstly, let’s check score in Google PageSpeed Tools

Check Pagespeed

Step 1: Enable Flat Categories and Products

May be you know that one of the aspects having a great influence on the speed of Magento 2 performance is the ability of database loading. In the configuration, 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, the MySQL query complexity will be reduced.

Go to backend, Stores > Configuration > Catalog > Catalog > Storefront, choose Yes in Use Flat Catalog Category field.

Magento 2 performance - Use Flat Catalog

Step 2: Merge CSS and JS Files

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 2 into production mode.

./bin/magento deploy:mode:set production

Javascript File

  • Go to backend, Stores -> Configuration > Advanced > Developer > JavaScript Settings
  • Set Merge JavaScript Files to Yes
  • Set Minify JavaScript Files to Yes

Magento 2 performance - Merge JS File

CSS File

  • Go to backend, Stores > Configuration > Advanced > Developer > CSS Settings
  • Set Merge CSS Files to Yes
  • Set Minify CSS Files to Yes

Magento 2 Performance - Merge CSS File

When complete, Save Config and flush cache to activate the change.

Step 3: Content Delivery Network

Content Delivery Network (CDN) is a special system that can connect all cache servers. In addition to supported geographical proximity, CDN will take over the delivering web content and fasten the page loading.

Please follow this guide to set up CDN for Magento 2 stores. Go to backend, Stores -> Configuration > General > Web > Base URLs (Secure)

Magento 2 Performance - Content Delivery Network

Step 4: Caching

In the backend, System > Cache Management.

Magento 2 Performance - Cache Management

Here, you find a plenty of caching options to flush your Magento 2 cache. Tap Enable and then Submit the options which you need.

Step 5: Image Optimization

The image is a necessary factor to make your Magento 2 store’s performance more vivid. However, the image size that is too heavy to upload on your site is one of the crucial reason for the overload page. Thus, compressing should be done before submitting any image. You can use JPEG format for Product images, and PNG or SVG for the layout as well as the logo.

Step 6: Enable Compression

Follow the resources to enable compression by Google’s offer.

Let’s change nginx compression directives from:

  • gzip_types: text/plain application/x-javascript text/javascript text/xml text/css image/x-icon image/bmp image/png image/gif; to
  • gzip_types: *;

Step 7: Reduce Server Response Time

By Magento 2 Buit-in cache functionality, your site’s response time is quite good with approximately 0.5s. But it is not ideal time as Google expects. Due to that, Magento 2 supports Full Page Cache via Varnish natively. Let’s setup Varnish to get the first byte around 0.1-0.2s.

Go to backend, Stores > Configuration > Advanced > System > Full Page Cache, tranfer Caching Application to Varish Cache.

Magento 2 Performance - Enable Varnish Caching

Open Varnish Configuration section, complete the settings:

Magento 2 Performance - Varnish Configuration

Step 8: Magento Updates

Remember update your Magento 2 store. Mageplaza team will try the best to help you optimize the site performance.

Result after optimizing Magento 2 store

Magento 2 Performace

Performance Toolkit (Optional)

Installation

jMeter:

– go to http://jmeter.apache.org/download_jmeter.cgi and download jMeter in Binary section (pay you attention that Java 6 or later is required) – unzip archive

Plugins (only if you want to use additional reports (like graphs)):

– go to http://jmeter-plugins.org/downloads/all/ and download JMeterPlugins-Standard and JMeterPlugins-Extras

– unzip them to appropriate ext directory of your jMeter instance.

– additional reports can now be added via GUI.

Usage

Before running the jMeter tests for the first time, you will need to first use bin/magento setup:performance:generate-fixtures command to generate the test data.

Run via console

Scenario can accept parameters that are described bellow in format <parameter_name:default_value>:

<host:localhost> URL component 'host' of application being tested (URL or IP). Default is 'localhost'.

<base_path:/> Base path for tested site. Default is '/'.

<report_save_path:./> Path where reports will be saved. Reports will be saved in current working directory by default. Default is './'.

<ramp_period:300> Ramp period (seconds). Period the request will be distributed within. Default is '300'.

<orders:0> Number of orders in the period specified in the current allocation. If <orders> is specified, the <users> parameter will be recalculated. Default is '0'.

<users:100> Number of concurrent users. Recommended  amount is 100. Minimal amount is 10. Default is '100'.

<view_product_add_to_cart_percent:62/> Percentage of users that will only reach the add to cart stage. Default is '62'.

<view_catalog_percent:30/> Percentage of users that will only reach the view catalog stage. Default is '30'.

<guest_checkout_percent:4/> Percentage of users that will reach the guest checkout stage. Default is '4'.

<customer_checkout_percent:4/> Percentage of users that will reach the (logged-in) customer checkout stage. Default is '4'.

<loops:1/> Number of loops to run. Default is '1'.

<admin_path:admin/> Admin backend path. Default is 'admin'.

<admin-user:admin/> Admin backend user. Default is 'admin'.

<admin-password:123123q/> Admin backend password. Default is '123123q'.

<think_time_deviation:1000> Deviation (ms) for "think time" emulation. Default is '1000'.

<think_time_delay_offset:2000> Constant delay offset (ms) for "think time" emulation. Default is '2000'.

Necessary parameters must be passed to [command line](https://www.mageplaza.com/magento-2-command-line-interface-cli.html) with "J" prefix: "-J<parameter_name>=<parameter_value>"

Example:

> cd /directory_of_jMeter/bin/

> jmeter -n -t /path_to_benchmark_file/benchmark.jmx -Jhost=magento2.dev -Jbase_path=/ -Jusers=100 -Jramp_period=300 -Jreport_save_path=./

Run via GUI

  • Open jMeter/bin directory and run jmeter.bat

  • Click in menu File -> Open (Ctrl+O) and select file; or drag and drop benchmark.jmx file in opened GUI.

On the first tab ‘Test Toolkit’ you can change ‘User Defined variables’ like as <host>, <users>, <ramp_period>, <orders>, <report_save_path>.

For running script click “Start” (green arrow in the top menu).

Results of running (Report types)

After running via GUI you can see result of working in left panel. Choose the corresponding report.

After running script via console report will be generated in the path that has been specified in <report_save_path>.

Threads

jMeter script consists of five threads. Setup thread and four user threads.

Percentage ratio between threads is as follows:

Browsing, adding items to the cart and abandon cart (BrowsAddToCart suffix in reports) - 62%

Just browsing (BrowsAddToCart suffix in reports) - 30%

Browsing, adding items to cart and checkout it as guest (GuestChkt suffix in reports) - 4%

Browsing, adding items to cart and checkout as registered customer (CustomerChkt suffix in reports) - 4%

About reports:

Summary Report.

Report contains aggregated information about threads.

Report file name is {report_save_path}/summary-report.log

Details http://jmeter.apache.org/usermanual/component_reference.html#Summary_Report

Detailed URLs report.

Report contains information about URLs.

Pay your attention that URL is displayed only in generated report file (in GUI, URL is not displayed).

Report file name is {report_save_path}/detailed-urls-report.log (can be open as csv format). Details http://jmeter.apache.org/usermanual/component_reference.html#View_Results_in_Table

About other types read on http://jmeter.apache.org/usermanual/component_reference.html

It comes to the end of tutorial: Magento 2 Performance Optimization.

Please leave comments if you have any questions, feedbacks.

Comments for Magento 2 Performance Optimization

You also may like these Magento 2 Extensions

One Step Checkout

$199
27 reviews

Layered Navigation

$99
15 reviews

SEO

FREE
14 reviews

Shop By Brand

$99
4 reviews

People also searched for:

  • magento 2 performance optimization software
  • magento 2 performance optimization
  • magento 2 performance and optimization
  • magento 2 performance based optimization
  • magento 2 performance optimization engineer
  • magento 2 performance optimization extension
  • magento 2 performance optimization
  • magento 2 performance resource optimization
  • magento 2 performance optimization website
  • magento 2 performance and resource optimization
  • magento 2 performance optimization in sql server
  • Optimize Magento 2 Performance