xSpeed Cache
Get Plugin
Features Pricing Reviews FAQ
Documentation Blog Support Community Free vs Pro Compare
Get Plugin

Browser Cache Settings

4 min read

Browser cache headers tell a visitor’s browser how long it can keep a copy of your files before asking for them again. This guide shows you how to turn the headers on and set how long things are cached.

What this does

When someone visits your site, their browser downloads files like CSS, JavaScript, fonts, and images. With browser caching on, xSpeed Cache adds Cache-Control and Expires headers that tell the browser to keep those files for a set time.

On a repeat visit, the browser reuses the files it already has instead of downloading them again. That makes the second and later page loads faster and reduces requests to your server. Intermediate caches, such as a CDN, follow these headers too.

Why use it

  • Repeat visits load faster because the browser reuses files it already has.
  • Fewer requests reach your server.
  • Works alongside page cache and a CDN.

How it gets applied

How the headers are added depends on your web server:

  • Apache or LiteSpeed. xSpeed Cache writes the Cache-Control and Expires rules into your site’s .htaccess file automatically when you enable the setting.
  • nginx. xSpeed Cache cannot write nginx config for you. It stores your settings and includes the matching directives in the server-block snippet on the Cache panel. You paste that snippet into your nginx config once and reload nginx.

Note: On nginx, the settings alone do nothing until you paste the snippet into your server config and reload. xSpeed Cache shows a notice until it detects the headers are live.

How to enable it

  1. Go to the xSpeed Cache dashboard in your WordPress admin.
  2. Open the Browser Cache panel.
  3. Turn on Enable browser cache headers.
  4. Set Static asset TTL and HTML TTL if you want values other than the defaults.
  5. Save your settings.

On Apache or LiteSpeed, that is all you need. On nginx, also copy the server-block snippet from the Cache panel into your nginx vhost and reload nginx.

Settings explained

SettingWhat it doesDefault
Enable browser cache headersTurns browser cache headers on.Off
Static asset TTL (seconds)How long browsers cache CSS, JS, fonts, and images.31536000 (1 year)
HTML TTL (seconds)How long browsers cache the HTML document.3600 (1 hour)

Enable browser cache headers

Turns the headers on or off. On Apache and LiteSpeed this writes the rules into .htaccess. On nginx it only stores the settings, and you paste the snippet into your server block yourself. Default is off.

Static asset TTL (seconds)

How long a browser is told to keep static files: CSS, JavaScript, fonts, and images. The range is 0 to 31536000 seconds, and the default is one year. These files are also marked immutable, which follows the common practice that fingerprinted asset files never change once published.

A long lifetime is safe for assets whose name changes when the file changes. Keep this high unless you have a specific reason to lower it.

HTML TTL (seconds)

How long a browser is told to keep the HTML page itself. The range is 0 to 31536000 seconds, and the default is one hour.

Keep this short. A short HTML lifetime means edits to your posts and pages reach visitors the same day, even if a CDN cached the page.

Tip: A long asset TTL with a short HTML TTL is a good default. Assets are reused for a long time, while the page itself refreshes often enough to show your latest content.

Best practices

  • Leave the asset TTL high and the HTML TTL low, as the defaults are set.
  • On nginx, paste the snippet and reload nginx right after saving, then reload one of your pages to confirm the headers are live.
  • Turn this on together with page cache for the best repeat-visit speed.

Troubleshooting

  • Headers are not showing on nginx. The settings alone do not change nginx. Copy the server-block snippet from the Cache panel into your nginx config and reload nginx. xSpeed Cache keeps showing a notice until it detects the headers.
  • My CSS or JavaScript changes do not show up. A browser may still be holding an old copy. Asset files are cached for a long time on purpose, so make sure your changed files are served under new names, or do a hard reload while testing.
  • No .htaccess rules were written. Automatic writing only happens on Apache or LiteSpeed, and your .htaccess file must exist and be writable.

FAQ

Does this work without page cache? Yes. Browser cache headers are an independent setting and can be used on their own.

What file types get the long asset lifetime? CSS, JavaScript, fonts, and images such as JPEG, PNG, WebP, AVIF, GIF, SVG, and icons.

Why is the default asset TTL a whole year? Fingerprinted asset files change their name when their contents change, so the old file is never reused by mistake. A long lifetime is safe and avoids re-downloading unchanged files.

  • How to Enable Page Cache
  • Configuring the Cache Preloader
  • Setting Up Object Cache (Redis and Memcached)