Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.tenbyte.io/llms.txt

Use this file to discover all available pages before exploring further.

Image Optimizer transforms images on the fly at the edge: resize, format conversion (WebP / AVIF), quality, crop, and more. You ship one master file to your origin and the CDN serves the perfect variant per device.

​
How it works

The query string is part of the cache key, so each variant is cached independently after the first miss.

​
Enable Image Optimizer

Image Optimizer
Click Turn on Image Optimizer. Once active:
Image Optimizer Active
The status flips to Image Optimizer is Active. Transforms work immediately on any image path on this distribution.

​
URL-based transforms

Append query parameters to any image URL.
ParameterValuesExample
widthpx?width=800
heightpx?height=600
formatauto, webp, avif, jpeg, png?format=webp
quality1–100?quality=80
fitcover, contain, fill, inside, outside?fit=cover
dprdevice pixel ratio?dpr=2
Combine freely: 
https://cdn.yoursite.com/photos/hero.jpg?width=1200&format=auto&quality=80
format=auto picks WebP / AVIF based on Accept header; falls back to the original.

​
Recipes

​
Responsive image

<img
  src="https://cdn.yoursite.com/photos/hero.jpg?width=800&format=auto"
  srcset="
    https://cdn.yoursite.com/photos/hero.jpg?width=400&format=auto 400w,
    https://cdn.yoursite.com/photos/hero.jpg?width=800&format=auto 800w,
    https://cdn.yoursite.com/photos/hero.jpg?width=1600&format=auto 1600w"
  sizes="(max-width: 768px) 100vw, 800px"
  alt="Hero" />

​
Avatar thumbnail

https://cdn.yoursite.com/users/123.jpg?width=64&height=64&fit=cover&format=webp

​
High-DPI screen

https://cdn.yoursite.com/photos/hero.jpg?width=800&dpr=2&format=auto

​
Verify a transform

curl -sSI "$CDN_HOST/photos/hero.jpg?width=400&format=webp" \
  | grep -iE 'content-type|content-length|x-cache'
Expected: 
content-type: image/webp
content-length: 18432
x-cache: HIT

​
Framework integration

Drop straight into your front-end framework. Per-framework guides:

​
Turn off

Image Optimizer Off
Click Turn Off. The CDN stops transforming and serves the master file as-is. Cached variants stay until they expire — purge /photos/* to flush them immediately.

​
Operational tips

  • Master in a high-quality format — JPEG quality 90 or PNG. Let the optimizer downscale; never upscale.
  • format=auto everywhere — covers AVIF-capable Chrome, WebP for everything else, JPEG for old Safari.
  • Cap width — limit the transform to widths you actually use (sizes attribute). Otherwise attackers can hammer the edge with ?width=N for every N.
  • Watch the cache. Each (width, height, format, quality, dpr, fit) tuple is a separate object. Define a small set in your component layer.
  • Pair with cache rules — long TTLs on /photos/* since transforms are deterministic per query.