How to improve Magento load times [Updated for 2017]

15+ seconds to under <2 second load time for Magento store

Magento can be awesome. Very customisable, looks awesome and it has all the tools. One area amateurs really seem to fail with is speed. It is normally a lot of basic things that a lot of smaller or less experienced developers overlook/forget when building to smaller scale. However soon as traffic and stock levels increase things can quickly snow ball to a grinding stop. What a lot of people don't realise is a few excesses, errors or fat and these quickly compound.

So you have tested your Magento store on webpagetest and there are a lot of Fs in your score and its slow over 8 seconds or even more. This normally were finger pointing starts, the client blames the developer and the developer blames the designer, the hosting, the admin and the client...

Then the tail chasing starts going from one exotic change to another. Moving from hosting to VPS. Then to bigger VPS. Talk of Cloudflare fixing all problems (lol). All the time avoiding the obvious. Always start with the basics and good practice first.

Stage one

So how do you get the elusive all A score. It's not to hard. Webpagetest.org tells you what you need and how to do. You should start with the basics. The first thing normally to do is assess the images. Yes boring old images. Here is what I look for.

  • All images are sized correctly or better yet I like them to be just under what they need to be. The more under sized the better because it means smaller files=quicker load times.
  • Code specifies the image size to take advantage of server side compression and resizing.
  • Images are in there smallest possible format, such as, .jpg instead of .png. Avoid; tiff, gif, svg (Do like the logo to be in svg, but it'll cost you load time)
  • Compress the images just below whats required quality wise. Keep your high res pictures with less compression for were they count. We love Kraken.io and there is an extension and API system to make it easier to compress. You will still need to crop them.
  • If you can combine pictures so there are less requests
  • Rinse and repeat over and over. Keep running your Magento store through Webpagetest.org and look for those slow loading pictures and work on them.

    Your not finished this job just because you get a green 'A' . You need to keep going until you have done the best you can possible do. Reworking and making compromises on the slowest loading pictures.

    Pragmatic compromise, such as, does this image behind all this test at the bottom of the page really need to be 300 dpi and full size or can I cut it right down to a rather crappy looking quality because it is basically hidden and no one will really be looking at it.

    Stage two

    Magento Loading time...whats slowing down rendering (when the customer sees something).

    Look through your speedtesting reports I like to use webpagetest, gtmetrix and pingdom. What your looking for is the order js loads and any extensions, widgets. Also which are the slow ones

    Ideally you should combine your css and js files, but if you have heavily customised Magento I often find this just breaks the theme. By all means if you can combine your files manually do it it will reduce requests. However don't panic if you can't. We will come to a work around later.

    Warning: Backup that Magento store or work on a parallel one befor messing with the JS and CSS.

  • The one thing that is pretty safe to do is move all your js so it loads last. This gives the customer the impression the site has loaded faster and stops the visuals from being held up by any slow loading scripts. Especially anything from third party sources, such as; Facebook, Google, Beetailer.

  • For css look to host common files else where to reduce server requests, such as; bootstrap use googles version. Do the same for JS if you can but be mindful not to setup with something slower than what you have. Always test and measure each change. Don't just accept it will be faster because you changed it.

  • The last thing is to look for those slow loading extensions and third party widgets. For some of the slow ones look to move them to another page not as important as your main page or lower down the page. Make sure they are up to date. Replacing them. Modify to work better. Also check they aren't spamming or sending data off spying on you. All this behaviour, morals aside, will slow your site down.

    Stage Three

    Check for website page errors.

    • Nothing will slow your website down worse than a browser searching for lost files and broken links. Dust off Your browsers Dev tool and check it all. Don't leave until you are finished.

    • Turn on and check the stores logs for errors.

    • Make sure all extensions are up to date and remove them if they are not in use.

    Stage Four

    Compromise
    Learn to compromise for performance. Performance tuning is part skill and part knowing when to compromise. For example if you have a large high res picture obscured by next and in a forget able part of the web page...does it really need to be high res. Could you compromise and a make the file half as large, four times smaller or even 100 times smaller?

    Tuning can be able small gains in lots of areas that will add up dramatically.

    Stage Five

    Server side tuning
    I am going to assume you have a good Magento suitable web hosting account with at least 2+ gig RAM Preferable running of SSD drives or a VPS of suitable size. I will also assume you have crunched the numbers for traffic/bandwidth/RAM/CPU/latency/peak traffic. So in theory everything is right? If not you need to upgrade. There are now a few magento specific services, including our mebsites.com magento hosting and you should move to one of these. Signing up to AWS is not enough and likely won't work.

    So after you have completed stages one to four lets start to look at the server improvements.

    Number one place to go is compression .gzip transfer. It flows on from the theory above, smaller files can be handled faster. Compression transfer basically compresses the content before transferring it. Just list when you .zip a file on your desktop. If you are in cpanel and the right modules a present all you will need to do is go to software/services section and then enable 'Optimise website' service. Now you files will be transfered via .gzip the improvement can be quite significant.

    You will need pagespeed cpc module to be installed to do this task. But other options are available to. This is were having a Magento experience System Administrator comes in handy.

    I won't go to much into the server side of things now as it is an blog post I will do later on. However the stack we normally use is this;

    (We are famous for making HA multi-location/nation server clusters for big installs/markets)

    Centos
    Cpanel
    SSD Raid 10
    4+ G RAM
    Local to users

    Nginix
    Fast CGI
    A later version of Php
    Pagespeed CPC
    Reddish

    It is not the best best stack available, however it does enable us to turn it on an off easily without using SSH. This makes things for a server with multiple installations, developments, developers, clients etc much easier to manage for all.

    Performance wise for non mega stores there isn't a lot of difference once your under 2 seconds and the above stack will get you there.

    I personally love varnish, but there are compatibility problems with some OS and Cpanel versions. It also can be a total nightmare with sites in development, I'll save all this for another blog though.

    Good luck and if you need help info@mebsites.com.au

  • Author image
    Senior Developer at Mebsites on the Gold Coast, Queensland, Australia. Mebsites is an acclaimed Magento and Custom Framework Web Software coding house.
    Gold Coast, Queensland, Australia Website