Cookie-Based Caching

Cookies are used to store small pieces of data from a website onto a visitor's browser. These pieces of data help improve the user experience by remembering what they had in their shopping cart, keeping them logged in, and much more. A feature that certain webmasters find useful is to cache assets based on a cookie value.

With the Cache Key Cookie feature you can do just that. This guide will explain how cookie-based caching works and what you need to know.

How does cookie-based caching work?

Cookie-based caching works in conjunction with the cookies you have defined at your origin server. For example, if a custom cookie is defined on your origin server you can check this by opening up Chrome DevTools, navigating to the Network panel, selecting an asset which is associated with said cookie, and scrolling down to "Request Headers".

Depending what you are trying to achieve, you can cache assets based on a particular cookie. For example, if you set cookies based on which language the visitor defines when they visit your site, then the resources required to display the site in a particular language can be cached. This is done by adding the name of your cookie variable in the Cache Key Cookie feature in the Zone settings within the KeyCDN dashboard.

For example, defining the cookie variable as language could be done for a website that offers content in multiple languages to visitors. Setting this variable will tell the CDN to cache the resources required to load the web page based on the value of the cookie.

Summary

With the use of this feature, a separate cache entry will be stored based on the cookie value. However, the downside to this is that it will lower your cache hit ratio (CHR) since the CDN will be required to check the origin if the cookie value differs, therefore resulting in a MISS every time this occurs.