Content Delivery

A Content Delivery Network (CDN) is the best place to host content. Videos, images, and any other type of static deliverable can be cached and distributed globally to keep latencies low. If someone in Tokyo requests your photo, they will receive it from a Tokyo datacenter. Faster and cheaper.

But a CDN is typically "dumb", basically just copying a file. What if you could dynamically change the file right before it is served? You could resize images to the perfect size for the device that is consuming it, on the fly.

This is what we call a Smart CDN. With Transloadit's special domain, tlcdn.com, you can have instant URL-based transformations of your media.

Here’s what’s under the hood:

my-app

resize-img

{
  "steps": {
    "imported": {
      "robot": "/s3/import",
      "credentials": "my-s3-credentials",
      "path": "/images/${fields.input}"
    },
    "resized": {
      "use": "imported",
      "robot": "/image/resize",
      "width": "${fields.w}"
    },
    "served": {
      "use": "resized",
      "robot": "/file/serve"
    }
  }
}

Your App name

Template name

Source S3 path to pick files from

Variable passed via URL. Use any /image/resize parameter

What to serve with 🤖/file/serve

How to use it

Save the original files in your own cloud storage. Since we are on AWS, S3 buckets will have the lowest latency, but any cloud bucket will work.
Create a Template with all needed importing and transcoding Instructions, and adjust their settings with variables that are populated via query parameters.
Refer to your App and Template names in the URL, request a file and pass the parameters that will determine the transformation.

Versatile

With the ability to leverage Transloadit’s Templates with tlcdn.com, you can embed complex workflows into transformations. This lets you only expose a few dials to the outside world as query parameters, making URLs short and secure. At launch, URL-based transformations support:

Workflows with up to 3 Robots combined
All importing and exporting Robots
🤖/file/serve to customize delivery options
Triggering other transcodes or background jobs to move data around when a URL is requested
Transformations from these Robots:

With more to be announced 😄

Performant

Our Smart CDN consists of a global network of servers (the CDN part), and a glue layer that forwards requests to our API's Assembly Engine, in order to transform media in realtime (the Smart part). The transformed results are cached, so that for the next 30 days (configurable), they do not need to be re-processed, but are served directly from a datacenter close to the end-user, saving time and encoding budget.

Loading time: CDN vs. API requests

We measured the loading time of the demo image of a canoe, shown above.

68ms

CDN: Much faster, using the cached version, close to the user

950ms

API: Slower, because the image is transformed on each request

CloudFrontʼs points of presence

Our CDN is based on AWS CloudFront. Its global network continues to grow, and now includes well over 200 Points of Presence.

💡 Our Smart CDN caches globally, but the initial transform is fasted when source files are in an S3 bucket that is close to where the end-user is.

If you have many unique transforms and want to save ~700ms on this request time, you can set up buckets in each of our 3 regions, with credentials for each of those.

You can then use the ${assembly.region} variable (which either returns: "us-east-1", "eu-west-1", "ap-southeast-1") and use it in your Template like so: "credentials": "my_${assembly.region}_bucket".

Affordable

While our Smart CDN is not positioned as the cheapest CDN on the market, it is powerful and can help you save development, integration, and maintenance time. With our Smart CDN, there is no need to write code in the form of SDKs, or to glue together many moving parts, roll out deploys or update apps in app stores. Our Smart CDN seamlessly integrates into Transloadit’s powerful encoding backend, yet is superbly easy to use.

If you can add an <img> tag, you’re ready to start using Transloadit's Smart CDN. Any fine-tuning of conversion parameters can be done in your Template.

<img
  alt="Thumbnail of my canoe trip"
  src="https://my-app.tlcdn.com/resize-img/canoe.jpg?w=400"
>

Up to 90% bandwidth reduction can be achieved by smart global caching and delivering photos and videos that are optimal for the device they are displayed on. Don’t waste a single byte on something that does not achieve higher display quality on the device. Besides cutting costs, smart global caching also helps you decimate your time to market.

Note: You can optionally wrap our Smart CDN with your own CDN in case you want to leverage existing cloud contracts, pricing and characteristics. In this case, you only pay for the conversion, and first transfer, which should be just a fraction of what your CDN sends out to the world.

Secure

DDoS Protection – customers are automatically protected against Distributed Denial of Service (DDoS), including the 2018 1.4 Tbps memcached reflection attack in 2018.

Signature Authentication – You can leverage Signature Authentication to avoid abuse and make URLs expire after generating them with your back-end. Below is a quick Node.js example, but there are examples for other languages as well.

const secret = process.data.env.TRANSLOADIT_AUTH_SECRET
const expires = +new Date() + 60 * 60 * 1000 // allow for 1 hour
const signee = `resize-img/canoe.jpg?w=160&h=160&expires=${expires}`
const algorithm = 'sha384'
const signature = crypto
  .createHmac(algorithm, secret)
  .update(Buffer.from(signee, 'utf-8'))
  .digest('hex')
const url = `https://my-app.tlcdn.com/${signee}&signature=${algorithm}:${signature}`