Tips to Speed Up Magento

Magento, owned by eBay, is one of the most widely used eCommerce platforms today that people to choose to grown their online business. In this post, we will discuss tips on how to speed up Magento performance to ensure you don’t lose any sales due to high abandonment rate or an unsatisfying user experience.




When it comes to choosing an eCommerce CMS or platform you have a lot of options. You could go with WooCommerce which is an extension of WordPress, Shopify, Volusion, and a number of other ones. The reason a lot of businesses choose Magento is because it is a very robust platform with a high level of functionality and customizability. It is highly scalable, meaning there would be no need to change to a different platform later on as you scale up.

According to BuiltWith, 16% of the top 100,000 eCommerce websites are using Magento, 22% if we also include Magento Enterprise. And WooCommerce comes in at a close second with 12%.



read more :  magento shop by brand

magento marketshare
Source: BuiltWith

According to Google Trends, the activity around Magento is still very high, since it’s official release in 2008. However, WooCommerce and Shopify have seen very rapid and consistent growth over the past few years so it will be interesting to see where Magento will be in the next five years.
google trends magento
Source: Google Trends
Speed Up Magento
#

Magento and WooCommerce are both known for having issues with speed and their performance degrading over time. Making sure your eCommerce solution is running fast is one of the most important factors to your sales, SEO rankings, abandonment rate, and the shoppers overall user experience.

    If an e-commerce site is making $100,000 per day, a 1 second page delay could potentially cost you $2.5 million in lost sales every year. - Kissmetrics

Follow these tips below on how to speed up Magento and keep it running fast to ensure return shoppers and sales.


Latest Version



It is very important that you are always running the latest version of Magento as updates generally contain bug fixes and performance improvements. There are three main steps when it comes to upgrading a Magento installation.
magento logo

    Install a fresh version the Magento file tree (the version you are trying to upgrade to)
    Run the installer from the file tree on top of the outdated database (thereby upgrading the database)
    Move over themes and custom extensions from the old version to the current version.

Upgrading Magento is a little more work than upgrading WooCommerce or Shopify, but Magento has a good in-depth tutorial on how to fully upgrade Magento.

Magento also does a good job of notifying you of important updates that become available within your notifications/messages inbox (depending on which version of Magento you’re using.
magento update notices


Content Delivery Network



Implementing a Content Delivery Network (CDN) with Magento is one of the easiest ways to instantly see decreased load times. By doing this, you will ensure you are serving your assets (product images, javascript, CSS) from multiple locations around the globe so they are delivered faster to your shoppers.
CDN

KeyCDN has a very simple [integration with Magento]/support/magento-cdn-integration) and Magento 2. Both can be setup with HTTP and HTTPS configurations.


Utilize Caching

#

There are many forms of caching that can be implemented with Magento. Many people have great success combining NGINX + APC + Memcache + Varnish caching.


Magento also comes with a built-in caching module as well, but 3rd party solutions seem to achieve better results. Make sure all Cache Types are enabled by navigating to “System” → “Cache Management”.
magento system caching
Browser Caching
#

Another form of caching you can leverage is browser caching. See the following snippets you can add to your .htaccess file, such as enabling Gzip compression and adding expire headers. Magento2 ships with an .htaccess file called .htaccess.sample which you can use to achieve the same goal. However, if you’re using an older version of Magento you may need to add these snippets manually if not already defined.
Gzip Compression
#

Gzip compresses web pages and stylesheets at the server level before sending them over to the browser.

<IfModule mod_deflate.c>
  # Compress HTML, CSS, JavaScript, Text, XML and fonts
  AddOutputFilterByType DEFLATE application/javascript
  AddOutputFilterByType DEFLATE application/rss+xml
  AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
  AddOutputFilterByType DEFLATE application/x-font
  AddOutputFilterByType DEFLATE application/x-font-opentype
  AddOutputFilterByType DEFLATE application/x-font-otf
  AddOutputFilterByType DEFLATE application/x-font-truetype
  AddOutputFilterByType DEFLATE application/x-font-ttf
  AddOutputFilterByType DEFLATE application/x-javascript
  AddOutputFilterByType DEFLATE application/xhtml+xml
  AddOutputFilterByType DEFLATE application/xml
  AddOutputFilterByType DEFLATE font/opentype
  AddOutputFilterByType DEFLATE font/otf
  AddOutputFilterByType DEFLATE font/ttf
  AddOutputFilterByType DEFLATE image/svg+xml
  AddOutputFilterByType DEFLATE image/x-icon
  AddOutputFilterByType DEFLATE text/css
  AddOutputFilterByType DEFLATE text/html
  AddOutputFilterByType DEFLATE text/javascript
  AddOutputFilterByType DEFLATE text/plain
  AddOutputFilterByType DEFLATE text/xml

  # Remove browser bugs (only needed for really old browsers)
  BrowserMatch ^Mozilla/4 gzip-only-text/html
  BrowserMatch ^Mozilla/4\.0[678] no-gzip
  BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
  Header append Vary User-Agent
</IfModule>

Expire Headers
#

Expire headers tell the browser whether they should request a file from the server or grab it from the browser’s cache.

<ifModule mod_expires.c>
   ExpiresActive On
   ############################################
   ## Add default Expires header
   ## http://developer.yahoo.com/performance/rules.html#expires
   <FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
   ExpiresDefault "access plus 1 year"
   </FilesMatch>
</ifModule>

Page Caching
#

Page caching is one of the most powerful ways to speed up Magento. Load is taken off from the webserver by serving pages already visited before from cache, which makes it a lot faster.

There are a few page caching extensions available for Magento, we recommend one of the following:

    Zoom Full-Page Cache
    Full Page Cache Pro
    Brim's Full Page Cache

LiteSpeed also offers a product called LiteMage which uses what they call “hole punching.” It designates certain areas of a page that can change and then the rest is served from cache.
litemage hole punching
LiteMage Hole Punching

 Enable Flat Catalog



Magento uses the EAV model (entity attribute value) to store customer and product data. Enabling the flat catalog for categories and products merges product data into one table, thereby improving performance by responding to MySQL queries faster. If your eCommerce store has more than 1000 products, this can very beneficial.

    Navigate to “Stores” → “Configuration” → “Catalog.”

    Under “Storefront” change “Use Flat Catalog Category” and “Use Flat Catalog Product” to “Yes.”
    magento flat catalog

    Click on “Save Config.”

    Clear the cache. The recommended way to do this is to delete everything from the /var/cache directory. You can also do it by navigating to “System” → “Cache Management” and clicking on “Flush Cache Storage” which is equivalent to deleting all the cache.
    magento flush storage cache

Image Optimization


As we mentioned in a previous post on lossless image compression, on average 56 percent of a website’s page weight is made up of images. Optimizing your product images can dramatically increase the speed of your pages as this decreases their download times. You can compress them before uploading them using a tool like PhotoShop or there are a number of extensions you can use to auto-optimize them. For Magento version <2 users, the following extensions are available.

    TinyPNG Extension
    Compressor Extension

GTmetrix also has a Magento extension called GTspeed. It includes image optimization as well as CSS/JS concatenation and minification. Take a look at the difference on a stock Magento install.
gtmetrix improvement magento

Additionally, for Magento 2 users, the Image Optimizer for Magento 2 is an option.

Concatenate (merge) CSS and JavaScript Files


Magento version <2 actually has a built in feature to concatenate (merge) your CSS and JavaScript files into one file. This will reduce your total number of HTTP requests and in turn help speed up the loading of your pages.

    Navigate to “System” → “Advanced” → “Developer.”
    Under “JavaScript Settings” and “CSS Settings” change the dropdown to “Yes” and click on “Save Config.”
    magento merge css js files
    After combining these files, you will need to clear the cache. Follow the process we mentioned earlier.

You can take this one step further by also minifying your CSS and JavaScript using a Magento extension like Minify JS / CSS.

Magento version 2 users can also concatenate JS/CSS and also have the option to minify JS and CSS as well as bundle JavaScript directly from within the dashboard without the need for any additional extensions.

Comments

Popular posts from this blog

How Should Shoes Actually Fit?

How to Test Ceramic Disc Capacitor

Why we use X-Pac Materials in our Bags and Packs