Search Our Database

How to extend cache Expiration in .htaccess

Last updated on Oct 2,2024 |

under

by icky

Introduction

Browsers typically cache static files, such as images, CSS, and JavaScript, to improve loading times for returning visitors. Over time, these cache files can grow, potentially slowing down your website or causing outdated content to be displayed. By setting expiration dates on these cached files, you can ensure that the browser updates them as needed, optimizing performance for both your site and its users. This method is also applicable when using a CDN for your website.

Prerequisites

Ensure you have access to your website’s root directory where the .htaccess file is located, or create one if it doesn’t exist.
Make sure you have a plain text editor to modify the .htaccess file.
Familiarity with basic Apache server configuration to handle caching headers and expiration rules.
Ensure your web hosting environment supports Apache’s mod_expires module, as it is required for setting expiration headers.

Step-by-Step Guide

Step 1: Locate Your .htaccess File

The .htaccess file is typically found in the root directory of your website. If it doesn’t exist, you can create one using a plain text editor.

Step 2: Copy and Paste the Expiration Rules

Add the following code into your .htaccess file to control the cache expiration for various types of files. Each file type is given a specific expiration period to ensure the browser caches content for the optimal amount of time.

# ----------------------------------------------------------------------
# Expires headers (for better cache control)
# ----------------------------------------------------------------------

ExpiresActive on

# Default expiration rule (1 month)
ExpiresDefault "access plus 1 month"

# cache.appcache needs re-requests in older Firefox versions
ExpiresByType text/cache-manifest "access plus 0 seconds"

# HTML documents (expire immediately)
ExpiresByType text/html "access plus 0 seconds"

# XML and JSON data (expire immediately)
ExpiresByType text/xml "access plus 0 seconds"
ExpiresByType application/xml "access plus 0 seconds"
ExpiresByType application/json "access plus 0 seconds"

# RSS feeds (expire after 1 hour)
ExpiresByType application/rss+xml "access plus 1 hour"

# Favicon (expire after 1 week)
ExpiresByType image/x-icon "access plus 1 week"

# Media files: images, video, audio (expire after 1 month)
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType video/ogg "access plus 1 month"
ExpiresByType audio/ogg "access plus 1 month"
ExpiresByType video/mp4 "access plus 1 month"
ExpiresByType video/webm "access plus 1 month"

# HTC files (for CSS3 compatibility)
ExpiresByType text/x-component "access plus 1 month"

# Webfonts (expire after 1 month)
ExpiresByType font/truetype "access plus 1 month"
ExpiresByType font/opentype "access plus 1 month"
ExpiresByType application/x-font-woff "access plus 1 month"
ExpiresByType image/svg+xml "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"

# CSS and JavaScript (expire after 1 year)
ExpiresByType text/css "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"
ExpiresByType text/javascript "access plus 1 year"

# Add Cache-Control headers for public caching
Header append Cache-Control "public"

Step 3: Save and Upload the .htaccess File

After inserting the expiration rules, save the .htaccess file and upload it to your website’s root directory. This will apply the new cache expiration settings to all static files specified in the code.

Conclusion

By modifying the .htaccess file and setting expiration dates on static files, you can improve your website’s performance and ensure visitors receive the most up-to-date content. This technique is particularly useful when using CDNs, as it allows the CDN to cache files for a specified period, reducing server load and speeding up the delivery of your website.

For additional assistance or if you encounter any issues, please contact our support team at support@ipserverone.com.

Article posted on 15 April 2020 by Louis