# Image Optimization

**The Image Optimization** and Resize Service allows you to dynamically transform images by adding parameters directly to your CDN image URLs. All transformations are performed at the CDN edge to reduce latency and offload processing from your origin.

By using edge-side transformations, you can improve load times, reduce origin workload, and deliver optimized images tailored for different screen sizes and layouts.

{% hint style="warning" %}
Each transformed image generates a unique cache object. To remove previously transformed variants, purge each URL individually.
{% endhint %}

<figure><img src="https://542970813-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FtK7oIwmhUHdEJcaH4Hx8%2Fuploads%2FmaFYhNYLX8UxmuT4WY5d%2Funnamed%20(8).jpg?alt=media&#x26;token=5351e6e4-014e-4712-bfce-ab4f6cef8fce" alt="" width="563"><figcaption></figcaption></figure>

## Common Conventions

<table><thead><tr><th width="174">Item</th><th>Description</th></tr></thead><tbody><tr><td><strong>Base URL</strong></td><td><code>https://{account}.mncdn.com/{module}/{parameters}/{path}/{image}.{ext}</code></td></tr><tr><td><strong>Supported Formats</strong></td><td><code>jpg</code>, <code>png</code></td></tr><tr><td><strong>File Limits</strong></td><td>Files larger than <strong>25MB</strong> or exceeding <strong>3000×3000 px</strong> will return <strong>415 – Unsupported Media Type.</strong></td></tr><tr><td><strong>Cache Behavior</strong></td><td>Each transformation (unique URL) is stored as a separate cache object.</td></tr><tr><td><strong>WebP Output</strong></td><td>Images may automatically be delivered as <strong>WebP</strong> depending on browser support.</td></tr><tr><td><strong>Origin vs CDN URL Example</strong></td><td><code>https://www.yourdomain.com/path/image.jpg</code> → <code>https://youraccount.mncdn.com/mnresize/400/300/path/image.jpg</code></td></tr></tbody></table>

{% hint style="warning" %}
You can test any transformation by opening its CDN URL directly in your browser.
{% endhint %}

{% hint style="info" %}
Some image requests may fail due to format or size constraints.\
See [*Image Optimization Troubleshooting*](https://clients.medianova.com/products/performance-cdn/image-optimization-and-webp/image-optimization/image-optimization-troubleshooting) for details.
{% endhint %}

## **Modules Reference**

Each Image Optimization module operates independently and uses its own parameter structure.\
Select the module that matches the transformation you need.

<figure><img src="https://542970813-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FtK7oIwmhUHdEJcaH4Hx8%2Fuploads%2F76iKhppu8lZraIjCGcH3%2Funnamed%20(9).jpg?alt=media&#x26;token=9e031aea-a8c2-402e-8c0e-473ef8495d01" alt="" width="375"><figcaption></figcaption></figure>

### MNRESIZE

#### Overview

Resize an image while preserving its original aspect ratio.\
Either width or height may be set to `-` to auto-calculate the other dimension.

<figure><img src="https://542970813-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FtK7oIwmhUHdEJcaH4Hx8%2Fuploads%2FN9ZJbXpSYIibafjBGYZO%2Funnamed%20(44).jpg?alt=media&#x26;token=f223d15c-67bd-4c35-ab26-575352c0c2d7" alt="" width="375"><figcaption></figcaption></figure>

#### Syntax

```
https://{account}.mncdn.com/mnresize/{width}/{height}/{path}/{image}.{ext}
```

#### Parameters

<table><thead><tr><th width="364">Parameter</th><th>Description</th></tr></thead><tbody><tr><td><code>width</code></td><td>Target width; use <code>-</code> for auto-calculated width</td></tr><tr><td><code>height</code></td><td>Target height; use <code>-</code> for auto-calculated height</td></tr><tr><td><code>path</code></td><td>(Optional) Folder path</td></tr><tr><td><code>ext</code></td><td><code>jpg</code>, <code>png</code></td></tr></tbody></table>

#### Examples

* `.../mnresize/400/225/image.jpg`
* `.../mnresize/-/300/image.jpg`
* `.../mnresize/400/-/image.jpg`

### MNPADDING

#### Overview

Add uniform padding around an image using a HEX color.

<figure><img src="https://542970813-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FtK7oIwmhUHdEJcaH4Hx8%2Fuploads%2Fy3R0NkEuHI0gNr2VsdM2%2Funnamed%20(1).jpg?alt=media&#x26;token=cb43606c-afa7-46c1-99c9-bc7602443253" alt="" width="374"><figcaption></figcaption></figure>

#### Syntax

```
https://{account}.mncdn.com/mnpadding/{width}/{height}/{hex_color}/{path}/{image}.{ext}
```

#### Example

`.../mnpadding/400/125/C0C0C0/image.jpg`

### **MNCROP**

#### Overview

Crop the image to the target dimensions by centering the original image.

<figure><img src="https://542970813-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FtK7oIwmhUHdEJcaH4Hx8%2Fuploads%2FxlfNjKzP3j0kRuQqwgQ1%2Funnamed%20(2).jpg?alt=media&#x26;token=06fd41a3-0d7f-49a0-a202-b58e27d8a4ad" alt="" width="375"><figcaption></figcaption></figure>

#### Syntax

```
https://{account}.mncdn.com/mncrop/{width}/{height}/{path}/{image}.{ext}
```

### **MNCROPRESIZE**

#### Overview

Resize and crop the image in one step to produce exact output dimensions without distortion.

<figure><img src="https://542970813-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FtK7oIwmhUHdEJcaH4Hx8%2Fuploads%2FOTMoCZfRj8q5qtATR6yq%2Funnamed%20(3).jpg?alt=media&#x26;token=900f55bd-5b37-4f92-ade0-68410b60f8bf" alt="" width="375"><figcaption></figcaption></figure>

#### Syntax

```
https://{account}.mncdn.com/mncropresize/{width}/{height}/{path}/{image}.{ext}
```

### **MNROTATE**

#### Overview

Rotate an image by 90, 180, or 270 degrees.

<figure><img src="https://542970813-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FtK7oIwmhUHdEJcaH4Hx8%2Fuploads%2FYVv1JgVpsy5BlKoyqlYO%2Funnamed%20(4).jpg?alt=media&#x26;token=0057c685-ed7a-4234-901a-12ec940452ca" alt="" width="375"><figcaption></figcaption></figure>

#### Syntax

```
https://{account}.mncdn.com/mnrotate/{angle}/{path}/{image}.{ext}
```

{% hint style="info" %}
MNROTATE cannot be combined with other modules.\
Supported angles: `90`, `180`, `270`.
{% endhint %}

### **MNWATERMARK**

#### Overview

Apply a custom watermark to all images served through the CDN.

#### Notes

* Watermarking must be enabled by Medianova Support.
* Newly served images receive the watermark automatically.
* Purge existing cache entries to apply the watermark to previously cached images.
* Transparent PNG watermarks are supported.

{% hint style="info" %}
Watermarked images cannot be rotated or cropped using other modules.
{% endhint %}

### **MNCUSTOMCROP**

#### Overview

Crop a specific region using pixel coordinates.\
Coordinates (`x`, `y`) represent the top-left point of the crop area.

<figure><img src="https://542970813-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FtK7oIwmhUHdEJcaH4Hx8%2Fuploads%2F9xwwXcIQdFFslmNJzPgb%2Funnamed%20(6).jpg?alt=media&#x26;token=98c779b8-f3a2-49d0-ba96-f97df5979164" alt="" width="375"><figcaption></figcaption></figure>

#### Syntax

```
https://{account}.mncdn.com/mncustomcrop/{width}/{height}/{x}/{y}/{path}/{image}.{ext}
```

#### Example

`.../mncustomcrop/800/1200/430/200/image.jpg`

## Compatibility & Limits

* Files larger than **25 MB** or exceeding **3000×3000 px** → `415 Unsupported Media Type`.
* Supported file formats: **jpg**, **png**.
* Each URL variation is **individually cached**; purge accordingly.
* Watermark and rotation cannot be combined.
* Optimized images may be automatically converted to **WebP** when browser-supported.