How to use Amazon CloudFront in your projects

It is increasingly common to hear about Amazon Web Services (AWS) and the range of benefits its cloud solutions offer to customers. But when you see how these services are integrated into complex technological architectures, you might be afraid of using AWS in your projects, since the setup seems to be quite complicated. In this article we discuss figuring out how to use one of the most famous AWS services, Amazon CloudFront, to reduce the delivery latency of our static content.

What is a Content Delivery Network and how does it work?

A Content Delivery Network (CDN) is a network of interconnected servers across different geographical zones. Its purpose is to provide a speed boost in the delivery of content such as website source files or multimedia content. This geographically distributed network basically works on the principle of caching, which significantly improves content loading.

Caching in this network works as follows:

• The CDN establishes an origin server from which the original content will be extracted.
• A user makes the first content request to the CDN from any geographical location.
• The CDN retrieves the requested content from the origin server to respond to the user, while simultaneously sending a copy of the content to the CDN server that is geographically closest to the user.
• The CDN server designated as the closest stores a copy of this content as a cached file.
• If the same user, or even a new user, subsequently makes a request from the same geographical area, the server that previously stored a copy in its cache will be responsible for responding to the request instead of the origin server.

The following image shows the above-described workflow:

As you can see, for subsequent requests, the content doesn't have to travel long geographical distances, which greatly reduces the content delivery latency.

AWS global infrastructure

AWS Regions and Availability Zones

AWS global infrastructure refers to the globally available data centers through which AWS makes its services accessible. Its infrastructure is composed of Regions, which are made up of Availability Zones. The image below shows the current global distribution of AWS infrastructure:

Regions and Availability Zones are probably the most frequently mentioned parts of AWS infrastructure. There is, however, another important component — AWS Edge Locations.

AWS Edge Locations

AWS Edge Locations are another part of the global AWS infrastructure, consisting of specially designed data centers focused on delivering services as quickly as possible. Amazon has a significant number of these data centers distributed worldwide, which may be located closer to users than Regions or Availability Zones. They are even available in geographic locations outside of AWS Regions. It's important to clarify that Edge Locations are used only by certain specific services, including CloudFront.

In the image below you can see Amazon CloudFront Edge locations:

Amazon CloudFront

Considering all of the previous concepts, we're moving to Amazon CloudFront. It is an AWS CDN service, which provides us with fast and easy access to all the benefits of a CDN, and even more. CloudFront uses AWS Edge Locations as its network of servers to deliver content globally.

How to use the service

Let’s look at one small practical example of how we can use the service and its benefits. I’m going to use an Amazon S3 bucket, which contains a wallpaper, as our origin server. The S3 bucket is in US East (N. Virginia).

When I open the wallpaper in my browser using browser developer tools, I can see how long it takes to get the content from my location (Colombia):

On average, after several tests, the total time varied between 250 and 350 ms. Now, let’s set up a CloudFront distribution over the S3 bucket and see its benefits.

Setting up a CloudFront distribution

Creation of a CloudFront distribution is quite simple: just provide the content origin and enter its name:

AWS allows me to create my own CDN by only setting the origin domain (my S3 bucket) and CloudFront distribution name (tech-talk-cloudfront-distribution):

Once the distribution is ready, it will provide you a URL that you can use to request content instead of the original URL provided by origin server. Now, requesting the content over the CDN instead of directly from the origin server, we will have the following results:

In our first content request over the CDN, we will have a similar — compared with requesting it directly from the origin server — response time (400ms). This is because the first request is made from my geographical location. But now, we see a new header in response headers called X-Cache with the value “Miss from cloudfront”:

This means CloudFront didn’t find a cached copy of the content we’re requesting and had to request the content from the origin server directly. This is normal, considering the workflow that I explained above. But CloudFront also internally sent a copy to the location closest to where the response originated from. From here on, all requests for that content that originate from the same geographical area will be processed by that (closest) Edge Location. We can also see a new X-Cache status “Hit from cloudfront,” as well as a considerable improvement in response time which, after several tests, varied between 60 and 100 ms:

This is how Amazon CloudFront helps us reduce content delivery latency.

Conclusion

Amazon CloudFront is the CDN service offered by Amazon Web Services, leveraging AWS global infrastructure to deliver content quickly. It offers several advantages, including improved security and reduced bandwidth costs. I recommend this service for its benefits and ease of use, which make it an excellent choice for projects such as websites, content streaming applications (e.g., video or music), software update distribution, and more.

I invite you to explore this great service on your own and discover the numerous benefits it has to offer. You can start with proof-of-concept testing, since this service falls under the free tier of AWS.