Azure on the Cheap posts focus on the architecture, techniques and technology in Azure that add considerable value without breaking the bank. This value is being measured in both the amount of effort taken to develop, provision, and maintain the resources, as well as the monthly charge for the resource.
Previous posts:
Azure Front Door caching and Azure CDN
This Azure on the Cheap post takes a look at the Azure Front Door (AFD) caching feature and Azure CDN. Caching static website content is a common technique to both improving user experience as well as reducing the load on webservers by offloading the delivery of static content to a dedicated cache service. Caching services like Azure Front Door caching and Azure CDN, are optimized for hosting static content and most CDN services are globally distributed.
But how does Azure Front Door compare with Azure CDN?
Azure Front Door
Azure Front Door provides a caching feature that is literally at a click of a button:
Azure Front Door does support some configuration of how caching is handled.
Most common requirements are supported including support for a Rules Engine.
Azure CDN
Azure CDN is also a feature that can easily be enabled in an Azure Storage. For example, in the Blob service menu, the Azure CDN option is available.
This requires a new endpoint to be created.
Once the CDN endpoint is created, you can control aspects of the CDN such as the blob container Origin path, supported protocols, caching rules, and other optimizations.
This post illustrates how website caching can help the performance of the Azure On The Cheap website. In the previous post we illustrated how using Azure Front Door improves performance by directing global traffic to Azure Storage near the user. We will attempt to improve performance by using the Azure Front Door caching feature.
Scenario
This post builds upon the previous post's example by introducing a dynamic component: Azure Functions. In this example, AFD distributes a static website globally. The website is composed of a landing page containing a searchable table and three galleries. The landing page is built with DataTables.net and sourced from an Azure Function. The purpose was to combine static and dynamic content. An important thing to note is the url of the Azure Function is contained in a javascript file. To solve this, an additional step in the GitHub Actions to determine the correct file when deploying to the regional storage location. This is not optimal and a bit ugly. In a future post we will explore how to clean this up.
The three galleries contain the same content but the images are referenced differently:
- The first gallery uses local files
- The second uses files sourced from Azure storage
- The third uses files sourced from Azure CDN
The images range from 11kb to 77kb in size.
The following illustrates the new project:
Azure Front Door is used to route traffic to a storage account in the closest region to the user. The static website contains a grid that uses retrieves data from an Azure Function running in the same region.
JMeter
Our favorite load testing tool is being used again, Azure DevOps Load Testing. Please see this wiki article on getting started. Unfortunately, it is just a matter of time before this DevOps feature is no longer available. Until then we will continue to use it. Please comment if you have a cheap alternative!
The JMeter test was written to perform the following:
- Navigate to the landing page
- Make an API call to the Azure Function
- Navigate to the gallery containing references to locally held images
- Navigate to the gallery containing references to images stored in the same blob storage
- Navigate to the gallery containing references to images from Azure CDN
The JMeter test was issued against a single datacenter to gauge the performance of the website with and without Azure Front Door caching enabled. The expectation would be without AFD caching the Azure CDN will be much faster as these should be sourced close. We also anticipate that the performance of the images sourced local to the static pages and the images sourced from storage should be relatively the same. This is because they are both being retrieved from the same blob storage account.
Without Azure Front Door caching enabled
Without caching enabled we can see a clear distinction between the images delivered from Azure CDN and the ones delivered from the storage account.
What is interesting is a performance difference between the images delivered from storage. The same file is sourced from the same Azure Storage blob account but one the Local Gallery is via AFD.
The test was then modified to introduce a new test that retrieved the files directly from storage and not through AFD.
The images retrieved through AFD do get a performance improvement just by using AFD. Nice.
With Azure Front Door caching enabled
But how does AFD with caching compare to Azure CDN? With AFD caching enabled, the same test is performed.
Both the images and the landing page received a healthy performance improvement with caching enabled. Though not a comprehensive test, the performance between Azure CDN and the AFD cache appear comparable.
An interesting thing to note is when looking at the AFD metrics, we can see the point when caching was enabled.
This illustrates how using AFD with caching could be valuable in scenarios where content is being delivered from a webserver.
Cost
So how does AFD with caching enabled and Azure CDN compare on cost? Comparing the cost of these two services is not really straight forward. AFD caching is a great feature and in many circumstances the simplicity of enabling this does makes sense. Once you begin adding additional features of Azure CDN like Rules, AFD does become more expensive as these are charged per ruleset. Comparing outbound data transfer pricing, Azure CDN is more cost effective.
Azure Front Door
In general, if your goal is to use AFD as a content delivery network, then Azure CDN makes more sense.
Summary
Though not an exhaustive comparison, this was a very useful exercise in exploring both Azure Front Door and Azure CDN. There are many ways of putting together cloud services and it is often not clear which combination is optimal. AFD is not a CDN but is much more. AFD can provide similar functionality but Azure CDN does just as good of a job at content delivery at a cheaper price!
Hopefully this series is useful (like if it is). As the solution includes additional functionality, we will continue to evolve the solution. Based on the findings in this post the next step is to change our static website to be delivered from Azure CDN and use AFD or Traffic Manager to route requests to the Azure Functions.