Recently one of my fellow Chapter Three colleagues asked this question to the group: "How do I see template changes without having to clear caches"? There were actually a few more expletives and swears in his original question, I'm paraphrasing for him (but also telling his mother on him). He was making some alterations to the page.twig.html for his theme, but he was having to clear caches after every single change, just to see it take effect. He had his Twig debug settings turned on and his Twig auto-reload setting turned on. Why was he still having to clear cache after every edit? We did some digging and the following post is the solution we discovered.
So Many Caching Levels
Drupal 8 actually has many levels of caching. Dynamic caching, Page caching, Twig template caching, etc... Sometimes as we are trying to theme or develop a site, one of these layers continues to get in our way and we are stuck having to clear caches after every little change we make. In this exercise, we will turn off more layers of Drupal's theme caching setup so that we aren't always having to "drush cr" after each tiny css and/or template change.
The one caching you likely will run into most of the time is the render caching. It ensures that no content is rendered again and again for each user, but instead just once. At the same time it ensures, by clever invalidation strategies, that no one ever sees something outdated.
On the one hand this is a great feature, but can be a bit monotonous while working on a site.
Exercise 3: Disable Drupal's render/theme caching
It is important that these settings are ONLY APPLIED AFTER THE SITE HAS BEEN INSTALLED. Trying to install a Drupal 8 site with these settings enabled can cause problems with the sites installation. This is because at the time of installation, the Null cache back-end specified by the settings file doesn't exist yet.
BEFORE CHANGING THE FOLLOWING SETTINGS, make sure to follow the Setting up theme debugging post. You will need to have your (local or development).services.yml in place and have twig:auto-reload setting set to TRUE. The following settings will make sure that render caching is off, but auto-reload needs to be set to make sure the twig template system keeps watching for template changes.
-
Open your settings.local.php file for your site. If your local site does not have a settings.local.php file, visit the Setting up theme debugging post and go through the exercise about creating a local settings file. It is important that the settings we are about to manipulate are done in this local settings file. Less risk of the settings making their way up to production.
-
Open the example.settings.local.php file too. This file will be located in the '/sites' folder. It is an example file provided by default core. We are only opening this file in case the settings we want are not already on our settings.local.php file. We will use this example file to copy and paste some settings if needed.
-
In your settings.local.php file, locate the section that starts with "Disable the render cache". If it is not in your settings.local.php file, locate it in the example.settings.local.php file. Copy that section from the example file to your local settings file.
The entire section we want looks like this.
/** * Disable the render cache (this includes the page cache). * * Note: you should test with the render cache enabled, to ensure the correct * cacheability metadata is present. However, in the early stages of * development, you may want to disable it. * * This setting disables the render cache by using the Null cache back-end * defined by the development.services.yml file above. * * Do not use this setting until after the site is installed. */ # $settings['cache']['bins']['render'] = 'cache.backend.null';
-
Uncomment the $settings variable for that section:
$settings['cache']['bins']['render'] = 'cache.backend.null';
-
In your settings.local.php file, locate the section that starts with "Disable Dynamic Page Cache". If it is not in your settings.local.php file, locate it in the example.settings.local.php file. Copy that section from the example file to your local settings file.
The entire section we want looks like this.
/** * Disable Dynamic Page Cache. * * Note: you should test with Dynamic Page Cache enabled, to ensure the correct * cacheability metadata is present (and hence the expected behavior). However, * in the early stages of development, you may want to disable it. */ # $settings['cache']['bins']['dynamic_page_cache'] = 'cache.backend.null';
-
Uncomment the $settings variable for that section:
$settings['cache']['bins']['dynamic_page_cache'] = 'cache.backend.null';
Now with these settings in place, Drupal's caching system is effectively turned off.
Note: Disabling the render caching is not at all a good idea on production, but rather you should learn how it works and enhance your code with the required metadata. More here
As you continue to work on the site, remember that you will experience slower page loads as nothing from the theme layer and pretty much nothing else is coming from the caching system. Make sure to disable these settings from time to time in order to get a better idea on how the site will actually render, as well as get an idea as to how your development work may or may not be slowing your site down.
For more information about Drupal 8's caching system, Wim Leers and Fabian Franz give an excellent presentation on the subject.
