Azure CDN is relatively new service (GA release was near the end of 2018) that allows users to share their static web site content globally, so that the site resources are close to web site users. CDN lifts network usage from the web server, which helps to scale the service. Like many other Azure services, the CDN pricing is based on usage and does not contain any upfront costs.
World of Snails
In recent months, we have built an online store on top of WordPress and WooCommerce. Customers corporation rules set the restriction that the store should be run on Azure and integrate with their other systems. Azure has a known reputation of not being the best place to host WordPress (https://vpsfix.com/5732/wordpress-ridiculously-slow-azure-web-apps/), but it is still usable with little tweaks.
In our case the database speed was first real problem and to tackle that we had to use VM based database solution. The PAAS offering of MySQL and MariaDB are limited to ~30 queries per second, which means that it is unusable for larger WordPress sites.
The other big obstacle was slow rendering speed. The page took seconds to load, before user could see anything. Part of that is the slow query speed of database, but that is not the whole case. Google has a good tool called PageSpeed Insights that can be used to track rendering speed etc. This case the average “First Contentful Paint” time was around 3 seconds which is way too long.
Azure CDN to the resque
Azure CDN is split into two different parts: CDN Profile and CDN Endpoints. Usually the company has one profile and multiple CDN endpoints. The profile is attached into resource group and contains the pricing model. Endpoints are actual URLs and services that serves the content. Azure documentation has good guide of how to create and configure CDN service.
After creating the profile and Web App type of CDN Endpoint we need to hook it into WordPress. To be able to use CDN in WordPress, we need some kind of plugin that can handle the routing of resources to CDN provider. In our case we used the plugin called CDN enabler. The CDN Enabler plugin is made by KeyCDN, which is a popular CDN company and offers the same kind of CDN service as Azure does. Plugin is not restricted to KeyCDN company CDN services only, so it is also suitable for Azure CDN too. Configuring plugin is dead simple, just paste the Endpoint URL into CDN URL and add included directories that should be served from CDN. You should also enable the CDN for HTTPS connections, because you are probably running your site behind the SSL certificate.
After the plugin is installed and configured, you can use the Chrome DevTools to verify that part of the content is really loaded from CDN.
After enabling the CDN “time to interactive” lost almost a second and Speed Index (average) dropped to 7.8 s. from 10.7 s.
Summary
Azure CDN is an easy way to lift network traffic from web server and it speed ups the page loading by providing resources near the customer. It does not have any upfront costs and can be used with services like Web Apps and Azure Storage.