Magento full page cache: The common issues and how to configure it

When you own a Magento website, there are lots of factors that affect the performance of the website. And one of them is website speed. It not only helps your site have a high ranking in SERP but also attracts more customers to your store and enhances their satisfaction when they visit. Besides, it’s the opportunity to get them to come back. Therefore, you should pay attention to your website speed. To assure it operates properly, Magento full page cache is a helpful assistance for your store. Therefore, in this article, we’ll talk about the common issues and how to configure Magento full page cache.

What is Page Cache?

Page Cache

A page cache is a transparent cache for the pages originating from a secondary storage device such as a hard disk drive (HDD) or a solid-state drive (SSD). To clarify, the page cache is a component that stores data. So future requests for that data can be served faster.

In Magento 2, a full-page cache module stores the entire HTML code of a generated page in the cache storage. As storage, Magento may use either a simple file system or more sophisticated systems.

When your store visitors open any page in the browser, their request goes to the Magento 2-page cache system:

  • If the requested page is inside cache storage, it is quickly returned to the visitor. A speed of such an operation is very high.
  • If the requested page is not present in the cache storage yet, Magento generates this page, adds it to the cache storage, and returns it to a customer. The speed of such an operation is much slower.

Page Cache Workflow: We see that if a page is served from the cache, Magento sends a response very fast. If a page is not in the cache, the response is slow.

Why is Page Cache so important?

The correct work of the cache system directly affects the store speed. And the speed influences the store performance in Google search results and the conversion of store visitors into buyers. So the importance of the page cache system is huge and Magento 2 site speed optimization is a very important task.

Page cache common issues in Magento 2

Page cache common issues

The first thing to do when your page goes slow is to look for the slow pages. You need to find such pages in your store and exam them individually using the following steps:

1. Check that Magento full page cache is enabled

First of all, please, open your Magento admin panel, go to the System > Cache Management, and check if the Magento full page cache is enabled.

It takes a lot of time. When developers did some job on a store, disabled the cache and forgot to enable it back at some point. As a result, the store was working without any cache and slowly.

2. Check if a page is served from the cache

There are two simple ways to check if a page is served from cache or not. You may use the one you consider to be simpler.

a) Check by the response time

For instance, if you have a page, open it in your browser. Then, open browser development tools: it will show you the page generation time.

Add any GET parameter to the end of the URL and open the new URL. Write down the page loading time from the developer toolbar, you will need the time for the following comparison. In this case, the page is generated from scratch. So its loading time is high.

Then, open the initial page and write down the loading time from the developer toolbar. Now the page should be served from the cache. Its loading time should be much smaller than in the previous case. If not, the page is not served from the cache. That’s a problem.

b) Check by Magento headers

To use this approach, you need to switch your Magento store to dev mode. Probably, it is not possible if your store is in production mode and has heavy traffic. But if you do tests on your dev host, this approach should be fine for you.

To switch your store to dev mode, just run the following command via SSH:

bin/magento deploy:mode:set developer

Then open any page and in the developer tools of your browser check the headers of that page (for Chrome you need to open View / Developer / Developers Tools and tab Network).

Find the header X-Magento-Cache-Debug. If its value is MISS, then the page is not served from the cache. If its value is HIT, the page is from the cache and should be loaded fast.

How to fix it?

How to fix it?

There are different types of cache problems that may happen. Some problems are pretty easy. Hence others need a careful approach and developer debugging.

However, from our experience, in 90% of cases, a page is not added to the cache (and the cache is not working for that page). Because of uncacheable blocks presence somewhere inside the page. If all your pages are not added to the cache, you have uncacheable blocks globally defined. And they disable your full page cache system entirely. To fix this cache problem, you need to find incorrect uncacheable blocks and remove or fix them.

All blocks are defined in the layout files, which are placed in the following folders:

app/design/frontend/[Package]/[Theme]/[Module]/layout/*
app/code/[Company]/[Module]/view/frontend/layout/*
vendor/[company]/[module]/view/frontend/layout/*

There are a lot of files inside those folders. It’s very time-consuming to check each file manually to find the issue. So we created a set of commands that will greatly speed up the process.

You can search uncacheable blocks using the following SSH commands:

cd app/design/frontend/ && grep --recursive -l 'cacheable="false"' * && cd ../../..;
cd app/code && grep --recursive -l 'cacheable="false"' * && cd ../..;
cd vendor && grep --recursive -l 'cacheable="false"' * && cd ..;

Magento full-page cache

To display category, product, and CMS pages rapidly, Adobe Commerce and Magento Open Source use full-page caching on the server. Magento full page cache improves response speed while reducing server load. Without caching, each page may be required to execute code blocks and retrieve data from the database. A fully-generated page can be read directly from the cache if full-page caching is enabled. 

Configure the Magento full-page cache

  • Go to Stores > Settings > Configuration on the Admin sidebar.
  • Expand Advanced in the left panel and select System.
  • Expand the Expansion selector in the Full Page Cache section.
  • Select one of the following options for Caching Application:
    • Built-in Application
    • Varnish Caching
  • Enter the TTL for public content to specify the timeout for the page cache. (86400 is the default value.)
  • If you’re using Varnish, make the following changes to the Varnish Configuration section:
    • Access list – Enter the IP addresses that can cleanse the Varnish settings and generate a config file. A comma should be used to separate numerous entries. Localhost is the default setting.
    • Backend host – This is the IP address of the server that generates the configuration files. Localhost is the default setting.
    • Backend port – Determine which backend port is utilized to produce configuration files. 8080 is the default value.
    • Grace period – Specify the number of seconds to utilize as a grace period while generating configuration files. In the Commerce DevDocs Configuration Guide, look for Advanced Varnish configuration.
    • Click the button for the Varnish version you’re using to export the configuration as a varnish.vcl file.
  • When you’re finished, click Save Config.

Conclusion

The Full Cache page allows pages to be rendered faster, which enhances your website’s load speed and response time, greatly improving the client experience. We hope you will be able to simply configure Full Page Cache or Varnish Cache in Magento 2 after following these instructions. If you still have concerns, please let us know via contact form. Our Magento Website Development will help you a lot with different awesome services. Besides, if you are looking out for a cost-effective Magento service for your eCommerce store, then look nowhere other than Magesolution. So don’t hesitate, let’s Magesolution solve all your problems.

EAV (Entity – Attribute – Value): Everything you need to know about this model in Magento 2