Configure Server to return the Cache-Control response

This setting tells the browser how long to keep a copy of the website and use it, instead of getting it from the server. This will reduce the website load time, and makes for a better user experience.

Options that come with Cache-Control:
no-cache: tells the browser to check if the resource has changed, if so it will download it again, if not it will use the cache version
no-store: forces the browser to not cache the resource, to get it every time it is required.
public: this tells the browser and any caching service in between that it is ok to cache this resource.
private: this tells the browser that it is ok to cache this resource, but tells any caching service in between not to cache this resource.
max-age: this tells the browser to reuse this resource for a certain amount of time “max-age=60” would cache the resource for 60 seconds.
s-maxage: this is only relevant to Content Delivery Networks. A CDN would be a caching service, this would tell the CND how long to cache the resource for, similar to max-age

Implementing Cache-Control responce

Apache:
The following snippet can be added to your .htaccess file to tell the server to set the Cache-Control header’s max-age to 84600 seconds and to “public” for the listed files. Expires and Cache-Control headers can also be included with Apache by using the mod_expires module.

<filesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
    Header set Cache-Control "max-age=84600, public"
</filesMatch>

Nginx:
This snippet can be added to your Nginx configuration file. The example below uses the Cache-Control header directives “public” and “no-transform” with an expire setting set to 2 days.

location ~* \.(js|css|png|jpg|jpeg|gif|ico)$ {
    expires 2d;
    add_header Cache-Control "public, no-transform";
}

PHP:
Cache-Control headers can also be added directly in your code. This example demonstrates using the PHP header to include Cache-Control setting a max-age of 1 day.

header('Cache-Control: max-age=84600');

Sources:
https://www.keycdn.com/support/cache-control
If you want to learn more visit:
https://www.keycdn.com/support/cache-control
https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/webfont-optimization

Comments

So empty here ... leave a comment!

Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Sidebar