Have you ever used any online tools to benchmark your website performance? You must have come across tools like Pingdom, GTmetrix, Google page insight, and many more.

These tools analyze web pages and prepare a report on the current page performance and tell you which part of your page is working fine and where you need to put some extra attention. These recommendations are best practices established by Google to help build a website for optimal front-end performance.

While testing your site using these tools you might come across the “use cookie-free domains” recommendation. Previously, I have published an article on how to avoid cookies in a domain by setting up a separate subdomain to serve cookie-free contents, using a CDN, and using the WP2Static WordPress plugin. 

However, in this article, you will go through the tutorial on how to set up a cookie-free domain using the WPRockt caching plugin.

What makes page performance optimization important?

Optimizing page performance is important and one of the factors used by Google’s algorithm to rank pages. It’s been an official signal from Google and you definitely want to strictly follow their guidelines to remain on top of the competition.

Not only that there are additional reasons for improving your page load time. 

1. A slow page means the search engine crawler will cover fewer pages using the allocated crawl memory budget.
2. Fewer crawls mean your website is getting less indexation.
3. Slow page negatively impacts user experience and increases page bounce rate.
4. Most importantly, a longer loading time affects goal conversion too. 

What does this “use cookie-free domain” recommendation refer to? 

An HTTP cookie is a packet of data that holds information about a particular client and can be used repeatedly. But if a page has some static content for example a static image, the browser will include those cookies while requesting for the static image. In such a condition, the web server ignores the cookies and thus they prove to be useless network traffic.

So to avoid sending unnecessary cookie requests performance checker tools recommend you to send cookie-free requests by creating a subdomain and hosting the static components there.

How does a cookie-free domain help in performance improvement?

Typically most of the websites have static information such as images, CSS files, JS files, etc. By configuring a domain that doesn’t set cookies to its content you are reducing the number of incoming requests to the server. 

Technically, reducing the HTTP request count required to render a particular page preserves bandwidth, improves server response time by delimiting extra bytes of data transmission, as well as improves overall page loading time. 

Since almost all performance checking tools recommend you to lower the total request count to render a page, serving cookie-free content is a win-win step towards that. Although you might not notice any performance grade improvement after serving cookie-less contents, it does impact mainly on the total load time and request count of a webpage.

How to set up a cookie-free domain using the WP Rocket plugin

WP Rocket is a premium caching plugin, arguably the best caching plugin available for WordPress. This plugin has a wide range of features and automatic optimization that makes it handy for both experienced and beginner WordPress users.

WP Rocket ensures your site load extremely fast, follows the lighthouse guidelines while the configuration is the easiest to set up.

Advantage of WProcket:

1. Quick configuration.
2. Powerful caching for better web performance (cache preloading, browser caching, lazy loading).
3. CDN integration, Database optimization.
4. Javascript, CSS compression, Easy generation of critical CSS.
5. Excellent community support.
6. Ecommerce and multilingual compatibility.

As we have discussed earlier, we are going to set up the WP Rocket plugin in WordPress and use its CDN feature to serve all the URLs of static files that will be rewritten to a particular CNAME of your choice.

The reason for implementing CDN to ignore cookies is that many CDN providers can strip cookies and thus it prevents the browser from receiving cookie response headers as well as including cookies along with HTTP requests.

Note: You can use any CDN you prefer for example RocketCDN, BunnyCDN, KeyCDN, etc. But with Cloudflare, you won’t be able to avoid cookies because Cloudflare injects a cookie called “_cfduid” in HTTP headers since they implement reverse proxy strategy and thus cookies are sent for all types of files.

#1. Install WP Rocket Plugin

Before installing WProcket you would need to purchase it from the official website. It comes with three pricing plans single, plus, and infinite.

• Single – $49 (One year of support and updates for 1 website)
• Plus – $99 (One year of support and updates for 3 websites)
• Infinite – $249 (One year of support and updates for unlimited websites)

Once you purchase the plugin go to your WordPress dashboard and click on add new plugin. You need to upload the zip file to WordPress and complete the installation. Don’t forget to activate the plugin after a complete installation and you will be good to go.

Tip: In case you don’t want to get yourself in these hustles and want everything to be set up I would recommend speedy site service. This service is designed to help people optimize their sites for upcoming core web vital updates and a lot of people already enrolled their sites into it. Along with the service, your site will receive a premium copy of the WP Rocket plugin fully configured to load your site faster. The service’s price point is very friendly plus I will provide you an additional $50 off coupon, which will make things much easier on your side – SPEEDY50.

Now on your WordPress dashboard menu expand settings and click on WP Rocket. 

It will take you to the WP Rocket dashboard. The dashboard contains a menu on the left where you can explore the features and configuration categories. On the right-hand side, you will notice the actual settings for each feature WP Rocket has. 

Check this image below: 

#2. Configure CDN in WP Rocket

On the WP Rocket dashboard click on the CDN option available on the left menu. You will see the option to enable the content delivery network setting and CNAME(s) configuration along with file type control.

For exception, you can exclude URLs of files that should not get served via CDN. You can ask for individual file exclusion or wildcard exclusion by using the (.*) command.

Now that you have the plugin ready to set up CNAME let’s understand what CNAME is and how it works. Next, you can use CNAME from any CDN to serve cookieless contents for the website’s static files.

How CNAME works?

The Canonical Name Record is a type of resource record in the DNS that maps one domain name to another canonical name. This can prove convenient when running multiple services together. 

Technically, while the user’s web browser requests for content to a server, its DNS resolver will forward the request to the server asking for the resources. If it finds a CNAME then the request goes to that canonical address asking for the contents of the website. And according to the request, the contents get served from the canonical address to the visitor’s browser.

The image below explains it properly:

#3. Create your CNAME using a CDN service 

Using RocketCDN:

Now you know what CNAM will do. It’s time to create the address using a CDN service provider. WP Rocket has its content delivery network called RocketCDN. It’s super easy to configure and you don’t need to struggle with complicated settings to initialize the service. 

It’s a premium CDN that costs around $7.99/month. You will notice a banner inside your WP Rocket CDN configuration panel to activate Rocket CDN.

The integration process is cool, all you have to do is enter your domain and it will automatically import files from your WordPress site using the pull zone. 

Next, you need to check the Content Delivery Network setting in WP Rocket and copy the CNAME provided by RocketCDN and enter it into the CDN CNAME textbox in WP Rocket.

Using KeyCDN:

KeyCDN is a great option to serve cookieless domains too. You can deploy KeyCDN to your WordPress site using the CNAME settings of the WP Rocket plugin. But before that, you need to follow the steps below to create a Zone URL in KeyCDN.

Step 1: First, go to the KeyCDN official website and create an account. You can start with a trial account or buy credit to start using the service.

Step 2: Now create a PULL ZONE inside the KeyCDN dashboard and save it.

(I’m using the same image I have used in the previous article to describe how it can be done), check this below;

Step 3: Wait for the zone to be deployed, it can take a couple of minutes to complete the process.

Step 4: Copy the zone URL and paste it on your WP Rocket’s CNAME field. While using the CDN address you can set the type of files to be served. You can set it to all files, CSS & JS, CSS alone, or JS alone. Just make sure you have selected what types of content you want to serve without cookies. Alternatively, you can set it to all files (default setting).

Step 5: Once done, save the setting and you are all set.

It can take a couple of minutes up to an hour to see the improvement but that will help you to stop cookies from being served with browser requests. 

Wrapping up: 

Manually configuring a subdomain to serve cookie-free contents takes a lot of configuration to be done which can end up causing errors to your site as well. The safest way to do it by using a caching plugin like WP Rocket and let the plugin & CDN handle all the technical works on behalf of you. 

Hope this post helps you, cheers.