---
title: image-optimizer
url: https://www.fastly.com/documentation/reference/compute/sdks/javascript/js-compute/image-optimizer/
---

**Kind:** Module  
**Package:** @fastly/js-compute 4.0.1  
**Path:** `image-optimizer`

## Interfaces

| Name | Summary |
| --- | --- |
| [ImageOptimizerOptions](https://www.fastly.com/documentation/reference/compute/sdks/javascript/js-compute/image-optimizer/interface.ImageOptimizerOptions/) | Options for the Fastly Image Optimizer, specified via the `imageOptimizerOptions` property in the `Request` constructor. See the [Image Optimizer reference docs](https://www.fastly.com/documentation/reference/io/) for detailed documentation on all options. |
| [Position](https://www.fastly.com/documentation/reference/compute/sdks/javascript/js-compute/image-optimizer/interface.Position/) | The position of a region. Provide exactly one of `x`/`offsetX` and exactly one of `y`/`offsetY`. |
| [Sides](https://www.fastly.com/documentation/reference/compute/sdks/javascript/js-compute/image-optimizer/interface.Sides/) | Pixel or percentage values for each side of an image. |
| [Size](https://www.fastly.com/documentation/reference/compute/sdks/javascript/js-compute/image-optimizer/interface.Size/) | The size of a region, specified as either absolute dimensions or a ratio. Exactly one of `absolute` or `ratio` must be provided. |

## Type aliases

| Name | Summary |
| --- | --- |
| [Color](https://www.fastly.com/documentation/reference/compute/sdks/javascript/js-compute/image-optimizer/type.Color/) | A color, either a 3 or 6 character hexadecimal string, or an object with RGB(A) components. |
| [Percentage](https://www.fastly.com/documentation/reference/compute/sdks/javascript/js-compute/image-optimizer/type.Percentage/) | A percentage, expressed as a string containing a number suffixed with a percent sign (e.g. `'50%'`). |

## Functions

| Name | Summary |
| --- | --- |
| [optionsToQueryString](https://www.fastly.com/documentation/reference/compute/sdks/javascript/js-compute/image-optimizer/fn.optionsToQueryString/) | Convert image optimizer options into the query string that is sent to the image optimizer, for logging and debugging purposes. |

## Variables

### Region

**Type:** `{ UsEast: 'us_east'; UsCentral: 'us_central'; UsWest: 'us_west'; EuCentral: 'eu_central'; EuWest: 'eu_west'; Asia: 'asia'; Australia: 'australia' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L72

Where image optimizations should occur.

### Auto

**Type:** `{ AVIF: 'avif'; WEBP: 'webp' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L86

Enable optimization features automatically based on browser support.

- `AVIF`: `'avif'` — If the browser's Accept header indicates compatibility, deliver an AVIF image. 
- `WEBP`: `'webp'` — If the browser's Accept header indicates compatibility, deliver a WebP image.

### BWAlgorithm

**Type:** `{ Threshold: 'threshold'; Atkinson: 'atkinson' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L97

Algorithm for converting an image to black and white.

- `Threshold`: `'threshold'` — Uses a luminance threshold to convert the image to black and white. 
- `Atkinson`: `'atkinson'` — Uses Atkinson dithering to convert the image to black and white.

### CropMode

**Type:** `{ Smart: 'smart'; Safe: 'safe' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L108

Mode for content-aware cropping.

- `Smart`: `'smart'` — Content-aware cropping that intelligently focuses on the most important visual content, including face detection. 
- `Safe`: `'safe'` — Allow cropping out-of-bounds regions.

### Disable

**Type:** `{ Upscale: 'upscale' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L119

Disable features that are enabled by default.

- `Upscale`: `'upscale'` — Prevent images being resized larger than the source image.

### Enable

**Type:** `{ Upscale: 'upscale' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L128

Enable features that are disabled by default.

- `Upscale`: `'upscale'` — Allow images to be resized larger than the source image.

### Fit

**Type:** `{ Bounds: 'bounds'; Cover: 'cover'; Crop: 'crop' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L137

How the image will fit within the size bounds provided.

- `Bounds`: `'bounds'` — Resize to fit entirely within the specified region, making one dimension smaller if needed. 
- `Cover`: `'cover'` — Resize to entirely cover the specified region, making one dimension larger if needed. 
- `Crop`: `'crop'` — Resize and crop centrally to exactly fit the specified region.

### Format

**Type:** `{ Auto: 'auto'; AVIF: 'avif'; BJPG: 'bjpg'; GIF: 'gif'; JPG: 'jpg'; JXL: 'jxl'; MP4: 'mp4'; PJPG: 'pjpg'; PJXL: 'pjxl'; PNG: 'png'; PNG8: 'png8'; SVG: 'svg'; WEBP: 'webp'; WEBPLL: 'webpll'; WEBPLY: 'webply' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L150

Output image format.

- `Auto`: `'auto'` — Automatically use the best format based on browser support and image/transform characteristics. 
- `AVIF`: `'avif'` — AVIF. 
- `BJPG`: `'bjpg'` — Baseline JPEG. 
- `GIF`: `'gif'` — Graphics Interchange Format. 
- `JPG`: `'jpg'` — JPEG. 
- `JXL`: `'jxl'` — JPEG XL. 
- `MP4`: `'mp4'` — MP4 (H.264). 
- `PJPG`: `'pjpg'` — Progressive JPEG. 
- `PJXL`: `'pjxl'` — Progressive JPEG XL. 
- `PNG`: `'png'` — Portable Network Graphics. 
- `PNG8`: `'png8'` — PNG palette image with 256 colors and 8-bit transparency. 
- `SVG`: `'svg'` — Scalable Vector Graphics. 
- `WEBP`: `'webp'` — WebP. 
- `WEBPLL`: `'webpll'` — WebP (Lossless). 
- `WEBPLY`: `'webply'` — WebP (Lossy).

### Metadata

**Type:** `{ Copyright: 'copyright'; C2PA: 'c2pa'; CopyrightAndC2PA: 'copyright,c2pa' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L187

Which metadata fields to preserve during transformation.

- `Copyright`: `'copyright'` — Preserve copyright notice, creator, credit line, licensor, and web statement of rights fields. 
- `C2PA`: `'c2pa'` — Preserve the C2PA manifest and add any transformations performed by Fastly Image Optimizer. 
- `CopyrightAndC2PA`: `'copyright,c2pa'` — Preserve both copyright and C2PA metadata.

### Optimize

**Type:** `{ Low: 'low'; Medium: 'medium'; High: 'high' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L200

Automatic quality compression level.

- `Low`: `'low'` — Output image quality will be similar to the input image quality. 
- `Medium`: `'medium'` — More optimization is allowed; attempts to preserve visual quality. 
- `High`: `'high'` — Minor visual artifacts may be visible; produces the smallest file.

### Orient

**Type:** `{ Default: '1'; FlipHorizontal: '2'; FlipHorizontalAndVertical: '3'; FlipVertical: '4'; FlipHorizontalOrientLeft: '5'; OrientRight: '6'; FlipHorizontalOrientRight: '7'; OrientLeft: '8' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L213

Cardinal orientation of the image (EXIF orientation values).

### Profile

**Type:** `{ Baseline: 'baseline'; Main: 'main'; High: 'high' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L228

H.264 profile class when converting to video.

- `Baseline`: `'baseline'` — Recommended for video conferencing and mobile applications. (Default) 
- `Main`: `'main'` — Recommended for standard-definition broadcasts. 
- `High`: `'high'` — Recommended for high-definition broadcasts.

### ResizeFilter

**Type:** `{ Nearest: 'nearest'; Bilinear: 'bilinear'; Linear: 'linear'; Bicubic: 'bicubic'; Cubic: 'cubic'; Lanczos2: 'lanczos2'; Lanczos3: 'lanczos3'; Lanczos: 'lanczos' }`  
**Flags:** since 3.36.0  
**Source:** https://github.com/fastly/js-compute-runtime/blob/70cf30af4e657879b2d1e7eafab880e39e3a3f7d/types/image-optimizer.d.ts#L241

Resize filter algorithm.

- `Nearest`: `'nearest'` — Uses the value of nearby translated pixel values. 
- `Bilinear`: `'bilinear'` — Uses an average of a 2x2 environment of pixels. 
- `Linear`: `'linear'` — Same as Bilinear. 
- `Bicubic`: `'bicubic'` — Uses an average of a 4x4 environment of pixels, weighing the innermost pixels higher. 
- `Cubic`: `'cubic'` — Same as Bicubic. 
- `Lanczos2`: `'lanczos2'` — Uses the Lanczos filter with sinc resampling for edge and linear feature detection. 
- `Lanczos3`: `'lanczos3'` — Uses a better approximation of the sinc resampling function. (Default) 
- `Lanczos`: `'lanczos'` — Same as Lanczos3.