MyPage is a personalized page based on your interests.The page is customized to help you to find content that matters you the most.


I'm not curious

Everything You Want to Know About Caching

Published on 11 May 17
2801
1
1

As internet users, we all get very frustrated with images that seem to take long to load, buffering videos, and pages that get stuck while loading. It is a lot quicker to load content from cache than it is to fetch the same resource from an originating server. It speeds up loading of resources, decreases server load, reduces latency, and cuts down bandwidth related costs.

What is a Cache?

A web or browser cache is a location on your computer where files are stored temporarily. The locally cached files include documents such as html files, JavaScript scripts, CSS style sheets, multimedia content as well as graphic images, all of which make up a website. HTTP headers issue instructions to the browser on how to cache websites. There are some headers to set and often, they will overlap. Here are some cache headers that you will probably need to consider:

Everything You Want to Know About Caching - Image 1
  • ETag
  • Last-Modified
  • If-None-Match
  • If-Modified-Since
  • Expires
  • Cache-Control
  • Date

Yes, they are quite a few. So, let us dive right in.

Cache validation: Entity Tags and Last Modified dates

An Etag is a token for validation, or in simple words, a type of number which is stuck on the file. This Etag is useful in that it enables the browser to check if a cached file is up to date. This is called cache validation. It does not request for the whole file; rather it just confirms if the same file version is still currently being served by the server. If so, it remains and if not, it is re-downloaded.

This is technically done by assigning each file with a code. Files received will come with headers such as Etag: "564bb8e6-4d3b". The data is saved, and when this very file is requested again, the browser now sends the header If-None-Match: "564bb8e6-4d3b". At this point, the web server now checks to see that this is corresponding to the file it has. If a match is found, a server now gives a 304 Not Modified response. Otherwise, it will send a 200 OK together with the files new version as well as a new Etag header.

You should note there is an alternative to the Etag or If-None-Match with an overlapping capability: Last-Modified/If-Modified-Since. Validation token is, in this case, a date not a hash, but for all purposes and intents, it is very much identical. Using them both is redundant, but they can both be used interchangeably. If the page you are creating is dynamic, it makes more sense using Etags, because you can hash data in order to see if it is the same as the last time. For the static files, it is probably better to use Last-Modified.

ETags are undoubtedly a critical cache mechanism because they provide big optimizations. It is still necessary to have a round trip to the server, but it saves you the trouble of having to redownload a file that you already have. If a cache file exceeds the maximum specified age or no-cache is set on the cache control, the ETags will typically come to play.

Cache-Control & Expiration Dates

Cache-Control is a HTTP response header that determines a specific file caching protocol. For below values, this can be put to comma-separated section.

  • Private or Public determine who can cache the file.

Public: The file can be cached by all intermediaries (like CDNs) as well as the browser.

Private: This is Cacheable by the browser.

  • No-store or no-cache define stricter rules in caching

No-cache: Cache the file, but do not use it before confirming with the server that it has not changed.

No-store: No one should cache anything.

  • Max-age: Time in seconds in which the cached file is available for used. After this, users will likely need to check for the file again.

Joining the settings is beneficial in some of the configurations:

  • Public and a specific max-age is only useful for static content.
  • Private plus a specific max-age may be beneficial for information that is not necessarily personal but may be specific to the user.
  • No-cache is important when it is vital to have the newest file version (for live feeds or content based on erratic numbers for example).
  • No-store is mostly for personal and private data that should for security reasons not be cached.

There is yet another header that has overlapping technology: Expires. While the Cache-Control: max-age=600 will ensure a 10-minute timeout, Expires: Fri, Nov 20 2015 23:56:13 GMT just times out the date set. Date headers are also added when using Expires, so that we can know what time it is according to the server. It is also important to know that max-age overrides Expires.

Choosing a strategy

Everything You Want to Know About Caching - Image 2

Having this in mind, you need to have a caching strategy in mind. This caching strategy will depend on how important the latest version is, and how often a specific file is updated. Different caching is required for every kind of resource because every file is different in nature.

As internet users, we all get very frustrated with images that seem to take long to load, buffering videos, and pages that get stuck while loading. It is a lot quicker to load content from cache than it is to fetch the same resource from an originating server. It speeds up loading of resources, decreases server load, reduces latency, and cuts down bandwidth related costs.

What is a Cache?

A web or browser cache is a location on your computer where files are stored temporarily. The locally cached files include documents such as html files, JavaScript scripts, CSS style sheets, multimedia content as well as graphic images, all of which make up a website. HTTP headers issue instructions to the browser on how to cache websites. There are some headers to set and often, they will overlap. Here are some cache headers that you will probably need to consider:

Everything You Want to Know About Caching - Image 1

  • ETag
  • Last-Modified
  • If-None-Match
  • If-Modified-Since
  • Expires
  • Cache-Control
  • Date
Yes, they are quite a few. So, let us dive right in.

Cache validation: Entity Tags and Last Modified dates

An Etag is a token for validation, or in simple words, a type of number which is stuck on the file. This Etag is useful in that it enables the browser to check if a cached file is up to date. This is called cache validation. It does not request for the whole file; rather it just confirms if the same file version is still currently being served by the server. If so, it remains and if not, it is re-downloaded.

This is technically done by assigning each file with a code. Files received will come with headers such as Etag: "564bb8e6-4d3b". The data is saved, and when this very file is requested again, the browser now sends the header If-None-Match: "564bb8e6-4d3b". At this point, the web server now checks to see that this is corresponding to the file it has. If a match is found, a server now gives a 304 Not Modified response. Otherwise, it will send a 200 OK together with the files new version as well as a new Etag header.

You should note there is an alternative to the Etag or If-None-Match with an overlapping capability: Last-Modified/If-Modified-Since. Validation token is, in this case, a date not a hash, but for all purposes and intents, it is very much identical. Using them both is redundant, but they can both be used interchangeably. If the page you are creating is dynamic, it makes more sense using Etags, because you can hash data in order to see if it is the same as the last time. For the static files, it is probably better to use Last-Modified.

ETags are undoubtedly a critical cache mechanism because they provide big optimizations. It is still necessary to have a round trip to the server, but it saves you the trouble of having to redownload a file that you already have. If a cache file exceeds the maximum specified age or no-cache is set on the cache control, the ETags will typically come to play.

Cache-Control & Expiration Dates

Cache-Control is a HTTP response header that determines a specific file caching protocol. For below values, this can be put to comma-separated section.

  • Private or Public determine who can cache the file.
Public: The file can be cached by all intermediaries (like CDNs) as well as the browser.

Private: This is Cacheable by the browser.

  • No-store or no-cache define stricter rules in caching
No-cache: Cache the file, but do not use it before confirming with the server that it has not changed.

No-store: No one should cache anything.

  • Max-age: Time in seconds in which the cached file is available for used. After this, users will likely need to check for the file again.

Joining the settings is beneficial in some of the configurations:

  • Public and a specific max-age is only useful for static content.
  • Private plus a specific max-age may be beneficial for information that is not necessarily personal but may be specific to the user.
  • No-cache is important when it is vital to have the newest file version (for live feeds or content based on erratic numbers for example).
  • No-store is mostly for personal and private data that should for security reasons not be cached.


There is yet another header that has overlapping technology: Expires. While the Cache-Control: max-age=600 will ensure a 10-minute timeout, Expires: Fri, Nov 20 2015 23:56:13 GMT just times out the date set. Date headers are also added when using Expires, so that we can know what time it is according to the server. It is also important to know that max-age overrides Expires.

Choosing a strategy

Everything You Want to Know About Caching - Image 2

Having this in mind, you need to have a caching strategy in mind. This caching strategy will depend on how important the latest version is, and how often a specific file is updated. Different caching is required for every kind of resource because every file is different in nature.

This blog is listed under Data & Information Management Community

Related Posts:
View Comment (1)
Post a Comment

Please notify me the replies via email.

Important:
  • We hope the conversations that take place on MyTechLogy.com will be constructive and thought-provoking.
  • To ensure the quality of the discussion, our moderators may review/edit the comments for clarity and relevance.
  • Comments that are promotional, mean-spirited, or off-topic may be deleted per the moderators' judgment.
  1. 11 May 17
    0

    Good info. Thanks for sharing.

You may also be interested in
 
Awards & Accolades for MyTechLogy
Winner of
REDHERRING
Top 100 Asia
Finalist at SiTF Awards 2014 under the category Best Social & Community Product
Finalist at HR Vendor of the Year 2015 Awards under the category Best Learning Management System
Finalist at HR Vendor of the Year 2015 Awards under the category Best Talent Management Software
Hidden Image Url

Back to Top