Putting your website behind a CDN like Akamai, Cloudflare or AWS Cloudfront

Joel Varty
Joel Varty
December 11, 2020
Putting your website behind a CDN like Akamai, Cloudflare or AWS Cloudfront

One of the easiest ways to ensure better performance on your website is to put it behind a CDN, which stands for Content Delivery Network. There are several providers out there, with industry leaders such as Akamai, Cloudflare and AWS Cloudfront that you might recognize.

There are also some other players that are becoming more popular, such as Stackpath and Fastly. Each platform provides essentially the same set of benefits, but each does so with a different approach.

For your own needs, you're probably looking to achieve the following:

  • Better performance and page loading speed, leading to better lighthouse scores.
  • Improved performance with a WAF (web application firewall)
  • Improved reliability with the ability to keep the website up even if your underlying web server is down.

The good news is that each CDN platform has some flavour of these features, and it's just up to you to pick which combination of pricing and feature mix suits your needs.

How to Setup Your Site Behind a CDN

Once you've decided on a CDN platform, there are a few things you can do to get started.

Akamai, AWS Cloudfront, Microsoft CDN

These are what I call the "old school" CDN providers. They have massive networks of small "nodes" spread out world-wide. They will probably give you the best performance in terms of raw network speed, but they do NOT allow you to purge your cache instantly.

If you're using these providers, especially Akamai, I recommend one of 2 approaches:

  • Pre-configure your cache rules in the CDN configuration on a per-path basis. This allows you to set up which paths on your site will have what cache timeouts.
  • Set up your website to output the proper cache-control HTTP headers to control the cache timeout. You could even control this using a content list that had the timeout rules set on a per-path basis. This is a great approach if you're able to do the development on your website, as it should work with ANY CDN provider.

With both of the approaches above, we won't even TRY to purge the cache for the website; we'll just set some appropriate time limits for how long something will stay in cache.

Cloudflare, Fastly, Stackpath

I consider these the "new-school" players in the CDN market. They don't have as much edge nodes in their network, but the nodes that they do have are more powerful in terms of their compute capabilities. They each allow you to do some level of scripting to control how each request is handled. Cloudflare calls these "Service Workers", Stackpath calls them "Edge Scripts". Those providers allow you to write JavaScript that runs a the edge. Fastly is built on a tech called Varnish, which has its own language called VCL.

One of the things you can do here is to create a "multi-origin" site, allowing you to do things like rebuilding your site page-by-page on a new framework without rebuilding the entire thing. This is a topic James Vidler and I have spoken about many times, including in this upcoming webinar.

With these providers, you can also include scripted and pre-defined rules that alter the cache timeouts on a per-path basis. They also allow for instant-purge of the cache, however, so you could use their REST API to manually purge the cache either from a button in the CMS, or automatically when a new build happens and content is published.

Instant purge is excellent for your editors so that they can see their changes immediately after publishing, however, if you have a lot of traffic on your site, performing an instant purge could take down your origin server, so keep that in mind.

The New New-school: Netlify & Vercel

Netlify and Vercel are relatively new to the CDN field, but they are quickly gaining market share and have some unique features and capabilities.

If you are looking at options for hosting your Jamstack site (built on something like Next.js, Gatsby, or Eleventy), then you really should look at Netlify or Vercel seriously. They provide a combination of CDN, Serverless Functions, DNS, and Build Server functionality to make your DevOps incredibly simple.

Even if you host your site on a standard web server, you can still use Netlify's rewrite and proxy rules engine to route it through their CDN. Vercel has a similar feature via its config files.

Conclusion

Deciding to put your website behind a CDN is a great first step. Depending on your choice of provider, you have a different set of options for best configuring each platform.

If you're looking at doing this, we'd love to hear your story and provide some guidance. If you have a CDN experience you'd like to share, we love to hear about that, too! Contact us or join our Slack channel to connect!

Learning JAMstack? So, this eBook is for you!

eBook JAMstack for Beginners - Agility CMS and Ikius
Back to All Articles

Our Latest Posts

image resource

A Wholesome Place to Work

I simply want to share my experience with a company that is truly handling things well, genuinely.

Read More >>
6 Ecommerce Digital Marketing Tips for More Online Sales

6 Ecommerce Digital Marketing Tips for More Online Sales

Attracting the right customers is not an easy task. With more ecommerce businesses propping up, it can be difficult to c...

Read More >>
SEO Meta Fields & Script Embeds in a Gatsby/Next.js Site

How Agility CMS Improves SEO for Gatsby and Next.js Sites

A big benefit to using static site generators such as Gatsby or Next.js is that they come with tools out of the box to h...

Read More >>