How to Speed Up Your Magento Site
As you probably know, Magento framework works slowly. Very slowly, sometimes. This post is a compilation of two articles on speeding up your Magento e-commerce store, from the first to the last byte.
When it comes to making your Magento site faster, you need to consider two parameters: time to first byte (TTFB) and browser rendering time. Before optimizing your frontend, you first need to reduce your TTFB. Let’s see how it’s done.
TTFB optimization
First, you need to understand what’s going on “inside” Magento. To do this, we’re using a smart built-in tool called Magento Profiler. It shows us a list of internal Magento calls and their execution times.
Also, you can include Profiler calls in your code to measure performance and detect bottlenecks.
How to enable Magento Profiler
In Magento admin panel, select System > Configuration > Advanced > Developer > Debug > Profiler. Switch Profiler to “Yes.”
In index.php file, enable this commented line:
Varien_Profiler::enable();
…
Make sure you’ve flushed Magento cash to get access to Profiler.
How to use Profiler in your code
Add Varien_Profiler::start(‘any_name) and Varien_Profiler::stop(‘any_name) lines to the block of slow code.
Varien_Profiler::start(‘any_name_here’);
…. Block of Magento code that is running slowly…;
Varien_Profiler::end(‘any_name_here’);
…
Profiler parameters
Code Profiler is an identifier you used in Varien_Profiler::start and Varien_Profiler::stop calls.
Time is the code execution time (in seconds) between Varien_Profiler::start and Varien_Profiler::stop
Cnt is the number of times the block of code was launched during the page load.
Emalloc is the memory size allocated for PHP during the run time of the code block via emalloc system call
RealMem is the size of physical memory allocated for PHP during the run time of the code block.
Switch off unneeded modules
Go to your website and then look at Profiler. First, find the lines with the word OBSERVER. These are observer modules that launch each time the page is accessed. You can switch off some of them. For example, if you’re not using reviews or sales rules settings, you can disable the Mage_Review and Mage_SalesRule modules.
Here is a list of Magento extensions you might not need:
- Mage_Reviews
- Mage_SalesRule
- Mage_Wishlist
- Mage_Bundle
- Mage_Downloadable
- Mage_Paypal
- Mage_Log
Also, your Magento may have additional extensions that you don’t need. These extensions launch their frontend observers each time the page is loaded. Naturally, this slows down your website.
Optimize code in .phtml files
Here is how you can improve PHP code in your theme files:
<?php $_collection = $this->getLoadedProductCollection(); ?>
<?php <strong>foreach</strong>($_collection <strong>as</strong> $_product):?>
<?php $_product = Mage::getModel(‘catalog/product’)->load($_product->getId()) ?>
<?php echo $_product->getSku() ?>
<?php <strong>endforeach</strong>; ?>
You don’t need to upload a model from catalog/product in each foreach cycle, because the model is already defined by the variable $_product. If you’re selling a pretty big range of products, you may end up with loads of unneeded accesses.
This is just one example of how messy your php code can be.
To reduce first byte time and speed up your website, you need to scrutinize the code in all .phtml files. Be sure to pay special attention to cycle structures.
Upgrade your Magento
The Magento team is working hard on improving their product. If you have an older version of Magento, be sure to upgrade it to the latest version. New releases feature improved code in many core files, which enhances Magento’s internal logic.
Frontend optimization
Now let’s see how you can speed up browser rendering.
- Category page
According to Google Page Speed, the page’s speed performance is 68/100.
First, we need to halt JS execution. This means removing Javascript and CSS from the ATF (above-the-fold) content.
How to remove JS/CSS
Select internal Javascript code and put it in the same function. After the page has loaded, you need to access that function and process external JS code.
Reduce JS/CSS
Compressing and reducing JS/CSS files can be done using various Magento extensions.
Set CSS priority for ATF content
This means that the page has too much content in the ATF area. We need to select the CSS part needed to render that content and include it into the file. The rest of CSS will be loaded asynchronously.
This is what we’ve got:
As you can see, the tab with the filter is displayed by default. This means that all filter-related html content will be loaded.
To make the filter tab invisible by default, you need to add display:none to the respective CSS request @ media.
Now our page has 100/100 score!
- Other pages
Now that we’ve reduced TTFB and paused JS and CSS, all we’re left to do is to optimize ATF content on the remaining pages.
Here are the scores we’ve achieved for a product card page, shopping card page, and standard website page:
Google PageSpeed score for a standard website page
Google PageSpeed score for a product card page
Google PageSpeed for a shopping card page
As you can see, we’ve managed to achieve a 100/100 score for almost every website page.
While speeding up your website can be a challenging and tedious task, the results are sure to blow your mind away! Your website pages will load way faster, even without cache. Cache ! = Performance. Start with optimizing TTFB on your Magento site and then work on frontend rendering.