• The Ultimate Page Speed Optimization Guide

    Why page speed is so darn important. There’s a whole lot of research going …

  • 7 best practices for awesome meta titles

    What is a meta title? The meta title is the main description of an online …

  • How to minimize HTTP requests

    What is an HTTP request? Most of the loading time of a website consists of …

  • How to enable GZIP Compression and Speed up your site

    What is GZIP Compression? GZIP compression is a way of making your HTML, CSS, Javascript …

  • How to cache your static resources

    How to cache your static resources

    Almost every website contains resources that don’t change very often. CSS, javascript and image files are excellent examples of this. These files are downloaded every single time a webpage is loaded. This could really increase the time it takes to load your webpages. Don’t you think that it would be better if ‘static’ resources wouldn’t have to be downloaded over and over again?

    What is caching?

    Caching (pronounced “cashing”) is the process of storing data in a cache. – Margaret Rouse – whatis.com

    So if caching is storing data in a cache, then what is a cache?

    A cache is a temporary storage area. For example, when your browser loaded this webpage it grabbed the CSS and Javascript files which are used on this page and placed them somewhere on your computer’s hard disk. These files are stored there temporary, so if you come back to this page soon it will use the downloaded files from your hard disk instead of redownloading them.

    This has two beneficial effects:

    • The website loads faster for the user.
    • The server doesn’t have to be bothered by any unnecessary traffic.

    So how do I start caching my static resources?

    Note: This tutorial is for XAMPP server installations only.

    In order to be able to start caching resources on an apache server you need to make sure of a couple of things.

    • Make sure the mod_expires module is installed and turned on in your apache server configuration.
    • Make sure the mod_headers module is installed and turned on in your apache server configuration.
    • Make sure your hosting company allows you to use a .htaccess file.

    You can contact your hosting company and they will be able to give you more information about whether or not you’re allowed to have these modules turned on and whether you can use an .htaccess file.

    The .htaccess code

    Credit for the code snippet below should go to Charles Torvalds from askapache.com

    NOTE: The lines starting with an # are comments meant to explain the code written below it.

    # Turn on Expires and set default to 0
    ExpiresActive On
    ExpiresDefault A0
     
    # Set up caching on media files for 1 year (forever?)
    
    ExpiresDefault A29030400
    Header append Cache-Control "public"
    
     
    # Set up caching on media files for 1 week
    
    ExpiresDefault A604800
    Header append Cache-Control "public"
    
     
    # Set up 2 Hour caching on commonly updated files
    
    ExpiresDefault A7200
    Header append Cache-Control "proxy-revalidate"
    
     
    # Force no caching for dynamic files
    
    ExpiresActive Off
    Header set Cache-Control "private, no-cache, no-store, proxy-revalidate, no-transform"
    Header set Pragma "no-cache"
    
    

    Recommendations

    • Use expires instead of Cache-control: max-age (expires is more widely supported)
    • Set expires to a minimum of one month for static resources.
    • Don’t set expires more than one year into the future.(It violates the RFC guidelines).
    • Set last-modified to the last date the resource was changed.

    Resources

    Here’s a good list of resources to help you on your way:

    Leave a Reply

    Your email address will not be published. Required fields are marked *