×

Given that four in ten Americans leave a mobile shopping site if it takes longer than three seconds to load, speed is of the essence if you run an eCommerce website. If your site is powered by Magento, you can easily improve its performance with the use of select plugins called Extensions. These are readily available for you to use via Magento Connect.

Using the Latest Version of Magento

Prior to adding any Extensions to your Magento installation, consider upgrading to the latest version. With the release of Magento 2.X earlier this year, you now have access to a redesigned back-end user interface that makes administrative changes much easier. Additionally, the updates comes with built-in improvements, especially in terms of caching, that will automatically speed up your site’s page load speeds.

Extensions for Optimizing Your Installation

Magento Connect offers many Extensions that promise to improve different aspects of your site so that it performs better. Using these Extensions allows you to easily optimize your site without having to manually tweak your site’s settings.

JS & CSS Compressor with Image Optimization

By reducing the size and the number of files used to build your site, you can speed up your page load times and make the download less expensive for your user.

One way to reduce the size of your files is to minify them, which is the process of removing anything that is not essential to the rendering of the page and making changes that reduce the overall size of the file. For example, you might remove all comments and whitespace and shorten long function and variable names. If you have images, the pictures might include a lot of metadata (such as where and when the photo was taken) that isn’t necessary for displaying to users. Generally speaking, all of these things can be removed without negatively impacting your user’s site experience.

Additionally, you will want to ensure that your server is sending over compressed versions of these files, not the larger originals to ensure that these get to the user as quickly as possible.

To reduce the number of files your site requires, you can combine like files. For example, you might consolidate multiple JavaScript or CSS files into one, or embed small snippets into the HTML so that smaller files can be eliminated completely.

One easy way of ensuring that all these things are done is to install the JS & CSS Compressor with Image Optimization Extension. By using this Extension, you can easily ensure that all of the best practices mentioned above are implemented without you having to manually make changes in each area for your site.

Full Page Cache

You can opt to have the static parts of your site cached so that the user does not have to wait for a full HTTP request cycle to obtain the files needed to see items that have not changed. For example, every user to your site that looks at a given product will see the exact same page, and that page probably doesn’t change very frequently. As such, it makes sense to cache the page, rather than accessing the database to regenerate this page over and over again for each request.

Optimizing Your Magento Installation

One easy way of doing this is to use Full Page Cache, which utilizes different caching systems to speed up your site:

  • Primary Page Cache: Primary caching is intended to decrease the time to first byte (TTFB) value, which is the amount of time it takes for the web browser to receive the first byte of the site in return from the server. This is important because nothing can be shown to your users until the HTML has been downloaded and parsed. Using this extension, your page is cached and the request never needs to make it to the database, which reduces the amount of time it takes for your user to see your site.
  • Secondary Page Cache: Secondary caching is intended for use with pages that have been cached, but also contain dynamic content. In addition to caching the static features of the page (which is done by the primary caching process), secondary page caching works for logged in users, users with items in their carts, and so on.  

By providing you with an easy-to-use graphic interface that offers a lot of configuration settings (in addition to auto-configuration options that fit a variety of use cases), Full Page Cache is a simple way of implementing caching on things you want cached and minimizing caching on dynamic content that does not need it.

Defer JavaScript

JavaScript is a render-blocking resource, which means that your site will not display to your users until the web browser has downloaded, parsed, and executed the code required for your site. While this is happening, your users will see nothing but a blank screen.

For example, whenever a reader navigates to the New York Times homepage, the third file requested by the web browser is a JavaScript file. Notice how the Waterfall chart shows that the fourth resource was blocked (indicated by the brown coloring of the chart) the entire time the JavaScript was processed. Not only was this image delayed, so was every resource that follows the JavaScript.

Optimizing Your Magento Installation

Defer JavaScript automatically places any JavaScript files called by your site at the end, allowing HTML and CSS to load first. Doing so allows the user’s browser to display your site even if the browser hasn’t finished working with your JavaScript. While the speed of your page fully loading doesn’t change, your users will see the site sooner that they would otherwise, making your site appear to be fast.

Fast Asychronous Re-Indexing

While slow server-side response times account for only 10% of page load delay times, a large amount of this is a result of issues with the database.

Every time you save a new product or product category, Magento re-indexes your database for improved performance. If your catalog is small, this process is not noticeable, but as your catalog grows, so too does the amount of time required for re-indexing. In addition, you cannot work with the administrative panel for edited, but unsaved, areas of your catalog during this process.

Fast Asynchronous Re-Indexing allows you to work on your catalog during the re-indexing process, which reduces the amount of time it takes to update your database appropriately and the amount of time it takes for your products to display to your potential buyers.

Conclusion

Speed is of the essence when running an eCommerce website. While optimizing your Magento installation can be a long, difficult process, there is an abundance of easy-to-use Extensions that is capable of doing a fair amount of this work for you. Because of this, you can easily implement changes that will decrease your site’s page load times and increase your customer’s satisfaction with your site.

Read more about page speed and web performance.

Suggested Blog Posts