ImageOptimizerOptions

Interfacein image-optimizer@fastly/js-compute 3.46.0since 3.36.0View source

Options for the Fastly Image Optimizer, specified via the imageOptimizerOptions property in the Request constructor. See the Image Optimizer reference docs for detailed documentation on all options.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
import { Format, Orient, CropMode, Region } from 'fastly:image-optimizer';
async function handleRequest(event) {
return await fetch('https://www.w3.org/Graphics/PNG/text2.png', {
imageOptimizerOptions: {
region: Region.UsEast,
format: Format.PNG,
bgColor: { r: 100, g: 255, b: 9, a: 0.5 },
brightness: -20,
orient: Orient.FlipVertical,
crop: { size: { ratio: { width: 4, height: 3 } }, mode: CropMode.Safe },
},
backend: 'my-backend'
});
}
addEventListener("fetch", (event) => event.respondWith(handleRequest(event)));

Properties

region

'us_east' | 'us_central' | 'us_west' | 'eu_central' | 'eu_west' | 'asia' | 'australia'View source

Specify the region where image optimizations should occur. This is the only required option.

auto

'avif' | 'webp'optionalView source

Enable optimization features automatically based on browser support.

bgColor

ColoroptionalView source

Set the background color of an image.

blur

number | PercentageoptionalView source

Set the blurriness of the output image. Number values are in the range 0.5-1000; percentage strings are also accepted.

brightness

numberoptionalView source

Set the brightness of the output image (-100 to 100).

bw

'threshold' | 'atkinson'optionalView source

Convert an image to black and white using a given algorithm.

canvas

{ size: Size; position?: Position }optionalView source

Increase the size of the canvas around an image.

contrast

numberoptionalView source

Set the contrast of the output image (-100 to 100).

crop

{ size: Size; position?: Position; mode?: 'smart' | 'safe' }optionalView source

Remove pixels from an image.

disable

'upscale'optionalView source

Disable features that are enabled by default.

dpr

numberoptionalView source

Set the ratio between physical pixels and logical pixels (1-10).

enable

'upscale'optionalView source

Enable features that are disabled by default.

fit

'bounds' | 'cover' | 'crop'optionalView source

Set how the image will fit within the size bounds provided.

format

'auto' | 'avif' | 'bjpg' | 'gif' | 'jpg' | 'jxl' | 'mp4' | 'pjpg' | 'pjxl' | 'png' | 'png8' | 'svg' | 'webp' | 'webpll' | 'webply'optionalView source

Specify the output format to convert the image to.

frame

1optionalView source

Extract the first frame from an animated image sequence.

height

number | PercentageoptionalView source

Resize the height of the image, as integer pixels or a percentage string.

level

stringoptionalView source

Specify the level constraints when converting to video. Must be one of: "1.0", "1.1", "1.2", "1.3", "2.0", "2.1", "2.2", "3.0", "3.1", "3.2", "4.0", "4.1", "4.2", "5.0", "5.1", "5.2", "6.0", "6.1", or "6.2".

metadata

'copyright' | 'c2pa' | 'copyright,c2pa'optionalView source

Control which metadata fields are preserved during transformation.

optimize

'low' | 'medium' | 'high'optionalView source

Automatically apply optimal quality compression.

orient

'1' | '2' | '3' | '4' | '5' | '6' | '7' | '8'optionalView source

Change the cardinal orientation of the image.

pad

SidesoptionalView source

Add pixels to the edge of an image.

precrop

{ size: Size; position?: Position; mode?: 'smart' | 'safe' }optionalView source

Remove pixels from an image before any other transformations occur.

profile

'baseline' | 'main' | 'high'optionalView source

Specify the H.264 profile class when converting to video.

quality

numberoptionalView source

Optimize the image to the given compression level for lossy file formatted images (0-100).

resizeFilter

'nearest' | 'bilinear' | 'linear' | 'bicubic' | 'cubic' | 'lanczos2' | 'lanczos3' | 'lanczos'optionalView source

Specify the resize filter used when resizing images.

saturation

numberoptionalView source

Set the saturation of the output image (-100 to 100).

sharpen

{ amount: number; radius: number; threshold: number }optionalView source

Set the sharpness of the output image.

  • amount: number — Sharpening amount (0-10).
  • radius: number — Sharpening radius (0.5-1000).
  • threshold: number — Sharpening threshold (0-255).

trim

SidesoptionalView source

Remove pixels from the edge of an image.

trimColor

Color | { color: Color; threshold?: number }optionalView source

Trim pixels from the image edges that match the specified color. Either a Color value, or an object with color and optional threshold (0-1) properties.

viewbox

1optionalView source

Remove explicit width and height properties in SVG output.

width

number | PercentageoptionalView source

Resize the width of the image, as integer pixels or a percentage string.