How to Use CDN or Content Delivery Networks

Published by Amar Vyas on

Introduction

The below post is about “How to use CDN or Content Delivery Networks for Website Speed and Performance”. This is a Work In Progress for the next few days- Mid-May 2020 at least. I wanted it to be a ‘live’ post, and that’s the reason for publishing.

There are three companion posts to this (rather long) post on CDN.

a. How I published a 3,500 word post on CDN (i.e. How I wrote this post)
Edit: This post has reached a 4,400 words!!
b. 7 Ways to optimize Images for your website
c. Which is the best image compression service?

Update 12 May 2020

I have added four more sources of CDN, and re-structured this post to make it reader friendly.

You can download the PDF version of this post shortly

You can watch a short video about this post below

What is a Content Delivery Network?

A CDN (Content Delivery Network) does what its name stands for: delivering content. The content can be in multiple forms. For example,

a. Images (e.g.files from Flickr) that you can display on your website,

b. Videos (e.g.embedding a YouTube video) on your blog,

c. Audio (e.g. Podcast episodes)

d. Other files,scripts, or text.

In plain simple terms, a CDN or Content Delivery Network delivers content from location or server A to the end user. That is, every time a user visits a website or uses an app, they get the content not from the website or the app, but from a different location. I will leave it as my simple explanation.

Amar Vyas, April 2020
Image showing types of CDN. Blog of Amar Vyas
Image showing types of CDN

For the curious, a simple google search about CDN gives us a list of results about the top CDN providers. The queries range from

“How To use a CDN?”

“How to set up your own CDN”, and

“Which CDN to use?”

This post will cover CDN for consumer level sites or apps, or for small businesses. Enterprise level CDNs like Akamai or Level3 are not covered in this post. Wikipedia has a list of Commercial enterprise grade CDNs. You might want to refer to or check out separately.
Scope of the blog post by Amar Vyas
Image of CDN or Content Delivery Network. Source: Wikipedia, used in Blog by Amar Vyas
Representation of CDN or Content Delivery Network. Left: Single server sending data to multiple users. Right: Multiple servers sending data to multiple users. Source: Wikipedia used under Creative Commons CC3.0

I have published a companion post: How I wrote the 3,500 4,500 word post on CDN. You can read it here.

Example: CDN Delivering Audio Content

Episode: Podcasting for Business

I am including a short audio I had recorded last year. This was for a two part blog series that I had written for a friend of mine. He owns a digital marketing agency called Bonoboz. The content you hear upon clicking the player gets delivered from one of our podcast hosting sites. I believe Podcast.co themselves store and serve the audio content from a third party provider like amazon AWS or google cloud platform. If you click on the player below, you will hear the audio in this browser window.


As an alternative, I would have to do something like this:

a. Upload the audio file onto this server.

b. Add the HTML code to tell the browser to display the audio player.

And the player would have appeared something like below.

Screenshot of how a HTML audio player appears on a webpage. Image by Amar Vyas
Image of Audio player in a webpage

Audio player using HTML5 code

or, use a pagebuilder like Elementor to create a better looking audio player. (More on that in a separate post)

There is a disadvantage of serving the audio locally from the server. Each time someone clicks to play the audio, the file gets served from the same server that hosts the website. For shared hosting sites, this would consume resources- processor, memory, disk, etc. and affect the overall performance of the website. Using the CDN makes things easier!

Good old YouTube Videos

I am leaving below a link to one of the videos I had created in 2016. This is a short video titled, “How to Subscribe to Baalgatha Podcast via WhatsApp?” On this page, this video is viewable through an embed code of YouTube.

Use of CDN: Putting In Practice

Let us move on from the theory to the practice. In the below sections, I will talk about the different CDNs that I have used over the years. Some are universal across the forms of content, for example Cloudflare or Amazon AWS. They may cache the files, leaving your original content intact. Others focus on Video (e.g. YouTube, Vimeo), Delivering Audio (SoundCloud, Libsyn, audioboom, Blubbry), Images (Gumlet, Flickr) or Text. Some specialize in delivering Fonts (Google Founts) or Scripts (e.g. CDNJs, Github) or large download files like ISOs for Linux distributions.

CDNs I have tried over the years

Cloudflare

Cloudflare is one of the most well known or popular Content Delivery Networks. I write this based on anecdotal evidence. It’s a name I have come across in forums, while reading How To’s and in articles from technology publications.

I was first introduced to Cloudflare while listening to an episode on This Week in Tech Podcast. This was back in early 2017, and Cloudflare was in the news for a security breach. That was the era when my knowledge of CDN was limited to linking one’s blog post to images on Flickr, or embedding a YouTube Video or audio for our podcasts.

List of products from Cloudflare- April 2020

I had purchased this plan from Carrd, for creating landing pages. However, the pages were loading very slowly from India. So I wrote to AJ, the founder and creator of carrd.co, and asked him if there a way to speed up the pages.

I think the servers for Carrd are hosted in North America where he was getting fantastic speeds. He did recommend that I use a CDN like CloudFlare and maybe that might help speed up the site. While I do not specifically recall the steps that I took but the interface for Cloudflare was (and is) very intuitive. The tutorials were very good. There are sites like stackexchange, and then also sites like about.com; and then there were some How-Tos on YouTube. I was able to set things up pretty much on my own. This includes adding CNames, A Records etc. for the different sites. So worked out quite well!

Later I learnt that there are other faster options for serving content. I have mentioned some of the options in the section below.

Cloudinary

From Cloudflare, I moved on to other CDNs. In my research I learned about Cloudinary when I was looking for resources to host media files. In my opinion till today Cloudinary remains one of the most robust and sophisticated services when comes to image manipulation, editing, serving different shapes and sizes of image etc. Their free tier is also quite useful for starter sites or a standalone blog. Though for higher usage, it can get expensive quite soon.

Logo of Cloudinary
Logo of Cloudinary

Cloudjiffy

Another service that I had tried last June was Cloudjiffy. They are not just a CDN only service- they are a Platform As a Service provider. Image hosting and manipulation is one of the many features they offer. I learned about them through Low End Talk website, and signed up for a month long trial in Mid-2019.

I did have a conversation with the founder about the way forward. At that point in time, there were some changes going on with Gaathastory and that’s why that conversation did not move anywhere. I think they are a work in progress still, but I was pretty happy with the service when I used it.

Logo of Cloudjiffy
Logo of Cloudjiffy

Gumlet

I was introduced to Gumlet in addition to Cloudinary at the same time when I was looking for CDNs for image. I had created a test account for Gumlet in Mid-2019. As of December 2019, I got purchased one code of lifetime deals from Appsumo. Over the past few weeks, I have set up a few sites from the gaatha story network,/a> to display images through Gumlet (now, including this one!)

I am also testing out this service, particularly their WordPress plugin, for my other blog site: amarvyas.com. The reviews for Gumlet (except its name) have been positive, and I see myself using this service more often in the days to come. In one of the forum posts someone mentioned that Gumlet will start video hosting as well. We will have to wait and watch that one.

Note that Appsumo have a lifetime deal for a similar service called Cloudimage as of April 2020.

Droplr

My Droplr plan is a subscription from Appsumo as well, and I got it almost by accident. Other than its basic features (File sharing,CDN, etc) I have not really tried out its features at this point in time. As I started using it, I realized some of its strengths as well as limitations. Screen recording on Mac still does not work for me. Other features like image manipulation, uploading from one device (and using on another) are some of the services I can use with aplomb.

My first usage with Dorplr was to upload the image and send the direct link of the image, file, or video to the user. I discovered later that it is possible to send the link to the actual path for the file. Thanks to a user “Uptime” on Low End Talk , I learnt how to use the link from the CDN rather than the images.gaatha.net domain.

Via CDN:

Via images.gaatha.net : You may get errors like the one below occasionally. I like to go the old-school way in such cases: link to the image page directly.

Image showing Error on Embed code for Droplr. Blog of Amar Vyas
Error on Embed code for Droplr

Nothing wrong in using the former option, but the direct link becomes useful while posting inline images on external forums, etc. For me this is particularly helpful while posting on internet forums which have limited overlap with the core business of gaathastory, which is podcasting.

PushrCDN

On Low End Talk, user Victor from PusherCDN had posted about a trial account for PushrCDN. I wrote to him and also exchanged some emails with the folks in his organization. This was in early March 2020. I also got some response from their CEO regarding some queries. I did try out the service and was pretty impressed with its speed and agility.

Image showing NetWork-Presence-PushrCDN-May2020. Blog of Amar Vyas
On this blog, you can find a mini-review of PushrCDN’s service. My testing of this service came to an abrupt halt because of the Coronavirus scare, and the shutdown announced by Government of India.

And I’ll probably leave it at that I think the service holds promise. The base plan at US $2.50 a month, about $30 a year does not seem too expensive. More so when particularly when you compare it to other CDN networks like KeyCDN, or BunnyCDN etc.

Podcast.co

Podacst.co is created by James, who earlier founded Alitu. I got the deal for this service from Appsumo as well. Our original aim was to set up one of our custom podcasts. Till then I have set up a master feed of all our podcasts.

In the example of CDN delivering audio, at the beginning of this post, I have used the plugin or the embedded player podcast.co. It seems to work pretty well. There is a bit of a lag of course right now. I don’t like the podcast co logo on the top right. Which is really annoying. There are a few other quirks and pain points with podcast.co, I will mention them in a separate post.

BunnyCDN

On our list, next we have BunnyCDN which I spoke about earlier. In the past I had used their 14-day trial for gaathastory. During that fortnight, all the images were served off of BunnyCDN Points of presence (POP). They do have Point of Presence in Bengaluru- that might explain why their speed is very good.

map of Asia showing POP for BunnyCDN in India
POP (Point of Presence) for BunnyCDN in India

On account of Easter, there was an Easter Egg hunt deal on LowEndTalk – Easter Hunt 2020, which made me poke around the BunnyCDN website. In the process I got 4 coupons worth, $ 11: good enough for 4 months of traffic through their CDN. More on that experience later.

Fast.io

I came to know about fast.io via the (the Martech group on Facebook. Fast.io is a service started by the same folks who had originally founded Mediafire.

Image showing the connection of Fastio with GDrive. Blog of Amar Vyas
Connecting Fast.io with GDrive

This service has a free option right now with 100 Gb per account, 10 domains can be connected to this free account. So works out quite well. I’ve linked about four sites to it. The images are hosted on Google Cloud or one of the other cloud storage sites including Dropbox. I have created a landing page with my short How To for Fast.io using the below mentioned service, Brizy. Will add the link separately.

Brizy

Brizy it is a web page builder similar to Elementor or Divi or Oxygen. But they also have a WordPress plugin. They are a hybrid provider, that is, they are a pagebuilder, and a content delivery network that enable publishing pages or content on a WordPress blog or site. They also provide Webhosting, as well as provide cloud hosting for their page builder.

It may seem like they are following the “one size fits all but” so far services worked quite well. Seems to be speedy, responsive, creating the pages is extremely easy.

Image showing Two options for hosting a page or site created with Brizy
Two options for hosting a page or site created with Brizy

I created two or three landing pages and hosted them on $1 a year or $2 a year shared hosting plan. In addition, I have one page about podcasts by gaatha story hosted on a $ 3 a year NAT VPS. The landing pages load very well, and do not consume too many resources of the server itself. All updates or changes to the page are made on Brizy’s servers, and the new information syncs on the hosted site. It’s a great way to utilize some really low cost low resource devices for displaying web pages. They may not work for regular traffic or a primary site. For my author website, amaryvas.com, I plan to set up a couple of such pages. They will go live when my books are ready for release.

Publitio

Publito  is another deal purchase from our through AppSumo. I have mixed feelings about this service. It holds a lot of promise. But this service does not work for us: it is simply too slow. I may use it more or less exclusively for video and not necessarily for images. In addition, I would use this for some custom audio files.

Screenshot showing Uploading images on Publitio for storage and streaming via CDN. Blog of Amar Vyas
Uploading images on Publitio for storage and streaming via CDN

Publist (Rethink Software)

Publist, which is now called as Rethink, was a purchase that I had made through another deal aggregator site called Pitchground . The experience has been decent except that as of February 2020, I am locked out of this service. Most likely it was my own doing or undoing. Since early March, I have reached out to customer service at Rethink Four times, it took an email to the founder to get a response.

Once this matter is resolved,

Edit April 14, 2020: I was able to retrieve the login details for my account. You can read my take on Rethink here.

Link to an image on Publist

Shortpixel

Shortpixel is an image compressor. They have a WordPress plugin, a script, and other tools for compressing the image files locally on your server or computer.

They also have a WordPress plugin called Shortpixel Adaptive Images which uses stackpath CDN. I have not used both it extensively, but when I did, I found it to be rather slow and sluggish. Therefore I’m not super excited or super happy with it.

Screenshot showing WordPress plugin for shortpixel Adaptive Images (Shortpixel AI). Blog of Amar Vyas
WordPress plugin for shortpixel Adaptive Images (Shortpixel AI)

Reboo

Last but not the least we have Reboo, which is more about creating adding some bells and whistles. So for example, this particular blog so far does not have a scroll up button, I may probably end up adding that some more colors, some bells and whistles. Social media sharing widgets, etc can be added via Reboo. They are actually loaded a layer or a mask on top of the webpage. So they are loaded off of reboot servers and not necessarily from here.

Screenshot showing effects on a Bludit theme using Reboo CDN. Image by Amar Vyas, April 2020
When this site was launched, I used Reboo to add features like social sharing the base Bludit theme

Arvan Cloud

Finally, I should mention the liner to about Arvan cloud. I have just started using it. I came to know about this site when I was looking up the list of CDNs on Github. Since this service was relevant to this post went ahead and did that. It is unfair to write or review a service which I have used for less than a day. Therefore I will write more about it later.

Dashboard of Arvan Cloud Content Delivery Network . Image taken by Amar Vyas, April 2020
Free Tier Plan for Arvan Cloud and CDN

In a future update of this post, I will also write a line or two about Modula; a plugin for WordPress. This plugin rather a series of plugins are useful for image compression, video, offloading images, creating beautiful image galleries, etc.They also use Shortpixel’s CDN service for optimizing and loading images.

Summary Table: : How I use the different CDNs

 Content Delivery Network or SitePurpose
1DroplrImages (primarily) – video is not the fastest to load. Forums, this site
2PublitioVideo (primary) and selected podcast episodes for gaatha story
3ShortpixelImages through the adaptive images- though very limited; CDN is lsow
4Fast.ioCDN for amarvyas.com, gaatha.net and MyKitaab.in
5GumletServing images for gaathastory.com and this blog
6CloudflareCache disabled for all other sites
7Rorariiamarvyas.com – feature images and some media files
8BrizyBrizy Cloud – for landing pages for podcast websites
9RebooUsed very occasionally on non-Wordpress sites (only for bells and whistled on the interface)
10Shared HostingNot recommended- using for testing with prior permission from provider .In most cases, using a shared hosting plan for Content Delivery Network might be against Terms of service (TOS) of the provider.
11VPS (Virtual Private Server)I have two NAT (Network Attached Terminals) that I use for hosting images and some files for a website. More on that in a later post.
12Cloud folder or file sharing siteVery sparingly used by me – for serving images of selected PDFs. Specifically, from pCloud
Table listing types of Content Delivery Services

Using Embed Codes or Plugins

If you have experience with a content management system like WordPress, you may be familiar with the idea of plugins or extensions that help. There are scores of sites like practically every social media site that allow you to embed their content onto your website. This is done either through a plugin or through an embed code. Simply put, you can share your Instagram or Facebook or Twitter, or even LinkedIn posts, this way. So also for Pinterest images, for example. And I mentioned earlier about YouTube, Vimeo and practically every other video service. When I mention LinkedIn, I should also should also mention about SlideShare. It is a site for sharing presentations, reports etc. In the past, I have embedded presentations from Slideshare into my blog posts.

Below is a screenshot from SlideShare showing the embed code(s) for a presentation I had created about MyKitaab Podcast

screenshot of Embed code from Slideshare- Blog of Amar Vyas, April 2020
Screenshot of Embed code from Slideshare. This code can be pasted into a webpage or a blog to ‘serve’ the content from Slideshare

Advantages of using Embed Codes

The advantage of using embed player or embed code is that the most recent version of the content is always visible in your post. This may or may not include comments and any other links. The content is of course served fromt he social media site. In the beginning of this post, I had added the video I’d created for Baalgatha. This was served from YouTube.

Limitations or Disadvantages

There is a downside to using embed codes or plugins. Many of them have third party trackers, and sometimes the pages take a long time to load. Some of them may or may not be compliant with the privacy policies of your site.

These days prefer to take a screenshot, which may be more of a static representation rather than a dynamic one. But that does actually work a little better. The exception is video, like I have done for this page, or a podcast episode, which is my own creation. In my experience, a video served from Vimeo is a lot faster, has less tracking compared to a video from YouTube.

File Sharing Services

In the CDN space, let me also mention services that allow sharing of files. Mega used to be one of the most popular sites and I believe for file swapping. Linux ISO which is hosted on a server through torrents, and I’m only talking about the legitimate ones.

Cloud storage as CDN : pCloud, Mega, Koofr, Dropbox and similar cloud storage or file sharing services.

I had originally posted the below image on pCloud and added the “shared” link below. My aim was to test a theory that some cloud storage services may not allow linking of media files on webpages. My theory appears to have one data point: pCloud for one limits the links. And for right reasons.

In most cases, the cloud storage provider may not object to the way I have hosted the image- essentially using their service as a CDN. Provided, the traffic generated as a result of this image linking is within the limits defined in my plan. The reason I am mentioning this is, be very careful while using a file sharing service as a CDN for image/ media files. It is okay to create a download link, but do check the terms and conditions before doing so.

image of a dog with a smiling face. Amar Vyas, April 2020
Image served from CDN

Also, I have tried creating buckets for the following services, but did not get around to using them a lot.

Other Ways I have Tried (but do not recommend)

There was a third way I had learned as well: using two different WordPress sites. The free version, of course. That way, I could use one site for publishing my blog posts and other from which I could serve the images or audio files. Not recommended at all- because it ends up really slowing things down!

Then there is the method many people use- hosting media files on shared hosting and linking them to the webpage or site. The feature image for this post also used a CDN in the past (temporary, albeit- from Stencil.) Now it is hosted on this WordPress site and served locally.

Image from Baaalgatha Podcast, hosted and served form Stencil. Blog of Amar Vyas
This image is hosted and ‘served’ from Stencil.
(note: This approach is not recommended particularly for high traffic websites)

Wrapping it Up: How to use a CDN or Content Delivery Network for your Website

Reading up, experimenting, and talking about CDN has been a great learning experience. As always, there have been a lot of frustrations and failures in the process. I began my journey with trying to solve a simple problem: How to load pages from Carrd.co faster. This included sites like about.amarvyas.com and others that are hosted on Carrd.co. Along the way, I stepped into this vast pool called CDN. I have learnt a lot about website speed optimization, image resizing, responsive images, setting up a subdomain for serving media, and so on.

Conclusion

In this post, there’s a summary or a short description of most of the service provides I have tried out. Next, I may write a series of posts, with each focusing on one particular provider in detail.At the end of this post, I have added some links and resources you may find useful.

I have consciously avoided focusing on issues like ‘What is the cheapest CDN” or “What is the best CDN for a WordPress site”? Also, I have tried to stay away from answers like “What CDN would you recommend?”

Amar Vyas, May 2020

The reason is that my way of setting up a website may be entirely different from yours. The primary purpose of this site and blog is writing, that is, text. When a page on this blog loads, the text comes the server. The images will be served from one or two CDNs. Same goes for audio and files. To add to the mix, I will make a PDF version of this particular blog post. This PDF will be made available on this post as a link- and will be served off a CDN. Somewhere in the setting for this site, I recall reading JavaScript files or fonts are served from their respective servers. This completes the majority of ways in which content can be delivered. With the exception of embed plugins from social media sites such as Pinterest, Twitter or Facebook, which I am loathe to add.

Screenshot of image hosted and served from Imgbb. Blog of Amar Vyas
Example of image hosted and served from Imgbb. This image is hosted and optimized on Cloudinary

Notes:

  1. List of Content Delivery Networks on Wikipedia
  2. There is a useful list of CDN providers on Github. This list has been superseded by a ‘fork’, which can be found here.
  3. Mashable – list of CDNs (published: 2018, may need updating)
  4. I found this post to be rather useful for more gyaan or insights on CDN. It is published on the Begindot website.
  5. For wordpress (only) : Optimole has a plugin that compresses images and delivers the images via CDN Free plan allows upto 5,000 visitors/ month; both FREE and Paid plans use AWS CloudFront CDN with over 200 POPs.
  6. Tinypng, an image compression site, also has a CDN with pricing on the higher end of the spectrum. I will cover the image compression services in a separate post.
  7. Another good resource I found was list of CDNs (many of them have free plans)
  8. During the course of writing this article, I learnt about Arvan Cloud, naturally curious, I created an account with them- and their free tier is pretty generous. Posting a screenshot at the end of this post, server from Droplr, since I ended up using them for the purpose of this post. I will write a separate post on Arvan Cloud.

screenshot of ArvanCDN

Which CDN(S) do you use? Write to me:

email: contact @amarvyas.com or on Twitter @meamarvyas.

Added: May 13, 2020: Many sites offer image hosting services, similar to YouTube and Vimeo for video. You can upload images form there onto sharing on web forums, etc.

Edited May 14, 2020

Feature Image by Dapple Designs from Pixabay.
Tools for Staying Productive - Blog of Amar Vyas
This blog post describes one of the many tools to stay Productive

3 Comments

Royal CBD · May 7, 2020 at 4:02 pm

I am really thankful to the owner of this website who has shared this fantastic post at here.

Oklahoma · August 22, 2020 at 7:54 am

Thanks for keeping me updated! Articles like this are perfect reads to keep up with the industry!

Leave a Reply to Royal CBD Cancel reply

Your email address will not be published. Required fields are marked *