DEV Community

Cover image for How to Add Expires Headers in WordPress
Meghna Meghwani for ServerAvatar

Posted on • Originally published at serveravatar.com

How to Add Expires Headers in WordPress

If you want to add expires headers in WordPress, it’s important to understand how browsers handle your website’s static files. Every time a visitor lands on your WordPress site, their browser downloads images, stylesheets, fonts, scripts, and other assets. If your server doesn’t instruct the browser to store these files locally for a certain period, it has to download them all over again on the next visit. This increases page load times, consumes more bandwidth, and negatively impacts your site’s performance.

The “Add Expires Headers” warning shows up in tools like Google PageSpeed Insights and GTmetrix precisely because it has a measurable impact on page speed. Beyond the audit score, slow-loading assets eat bandwidth, hurt your SEO, and create a poor experience, especially for returning visitors.

This guide walks you through exactly how to fix it. You’ll learn what Expires Headers actually do, how they differ from Cache-Control, which file types should be cached for how long, and most importantly, how to set everything up on your server without breaking your site.

TL;DR

  • Expires Headers tell browsers how long to keep cached files before asking the server again
  • They directly improve load speed for returning visitors and reduce server bandwidth
  • CSS, JS, images, and fonts should be cached for extended periods; HTML should not
  • NGINX uses expires directives inside location blocks; Apache uses mod_expires in .htaccess
  • Clear your site cache after making changes, and always test before going live

What Are Expires Headers, Exactly?

When a browser requests a file from your server, the server responds with the file along with HTTP headers. These headers are invisible to visitors but carry instructions that browsers follow.

An Expires Header tells the browser: “Keep this file in your local cache until this specific date and time. Don’t bother asking me for it again until then.”

Without it, the browser has no persistent instruction. It may still cache files temporarily based on its internal heuristics, but it will frequently revalidate with your server, adding latency to every page load.

What this looks like in practice: a first-time visitor downloads your entire page design. A returning visitor three days later should theoretically load everything from their local cache. But without Expires Headers, the browser checks with your server anyway, waiting for confirmation that the files haven’t changed. For a text-heavy page with multiple assets, those round-trips add up fast.

headers

Expires vs. Cache-Control: Why You Need to Know Both

These two get confused constantly, and for good reason, they do essentially the same job. But they go about it differently.

Features_table

Here’s the practical detail that trips people up: if both headers are present, Cache-Control wins. Browsers prioritize the newer standard and ignore the older Expires date when both exist. Mozilla’s MDN documentation on HTTP caching is a solid reference if you want to go deeper on how these headers interact.

Which One Should You Use?

Most servers today default to Cache-Control because it’s cleaner and more precise. But if you’re manually configuring headers, there’s no harm in setting both, you just need to make sure they don’t contradict each other, or the Expires header becomes meaningless noise.

How Long Should Each File Type Be Cached?

Not every asset on your site deserves the same caching treatment. Getting this right is where a lot of people go wrong, either over-caching things that change often, or under-caching things that never change.

Here’s the logic:

  • Files that rarely change, like images, stylesheets, JavaScript, and fonts, are ideal candidates for long-term caching. You set them once, and browsers hold onto them for months. The performance gain is substantial because these are typically the heaviest files on any page.
  • Files that change frequently, like your HTML documents, should get short or zero caching. Your HTML is where new content lives. If a visitor’s browser caches your homepage for a year, they’ll never see your latest blog post. It kills content freshness and makes your site feel broken.
  • Third-party files, like Google Analytics scripts or Facebook Pixels, are outside your control. You can’t set headers on files you don’t host, so don’t worry about those in your configuration.

Read Full Article: https://serveravatar.com/add-expires-headers-wordpress

Top comments (0)