# Biblioteca `WASM Image Processor`

import DocButton from '~/components/webkit/DocButton.vue';

A biblioteca **WASM Image Processor** da Azion fornece funções para processar imagens usando **WebAssembly**. Essa biblioteca permite carregar, redimensionar e recuperar imagens em vários formatos de forma eficiente.

<DocButton href="/pt-br/documentacao/produtos/azion-lib/visao-geral/" label="Saiba mais sobre as Azion Libraries" kind="secondary" size="medium" />

---

## Uso

### loadImage

Carrega uma imagem de uma URL ou caminho de arquivo.

Exemplo:

```typescript
import { loadImage } from 'azion/wasm-image-processor';
import type { WasmImage } from 'azion/wasm-image-processor';

const image: WasmImage = await loadImage('https://example.com/image.jpg');
```

**Parâmetros**:

| Parâmetro | Tipo | Descrição |
| --- | --- | --- |
| `pathOrURL` | `string` | A URL ou caminho de arquivo da imagem a ser carregada. |

**Retorno**:

| Tipo de retorno | Descrição |
|-----------------|-------------|
| `Promise<WasmImage>` | Uma `promise` que é resolvida em uma instância de `WasmImage`. |

### resize

Redimensiona a imagem carregada.

Exemplo:

```typescript
import { loadImage } from 'azion/wasm-image-processor';
import type { WasmImage } from 'azion/wasm-image-processor';

const image: WasmImage = await loadImage('https://example.com/image.jpg');
const resizedImage: WasmImage = image.resize(0.5, 0.5);
```

**Parâmetros**:

| Parâmetro | Tipo | Descrição |
| --- | --- | --- |
| `width` | `number` | A nova largura da imagem. |
| `height` | `number` | A nova altura da imagem. |
| `usePercent?` | `boolean` | Se deve usar porcentagens para redimensionamento. Valor padrão: `true`. |

**Retorno**:

| Tipo de retorno | Descrição |
|-------------|-------------|
| `WasmImage` | Uma nova instância de `WasmImage` com a imagem redimensionada. |

### getImageResponse

Recupera a imagem processada no formato especificado.

Exemplo:

```typescript
import { loadImage } from 'azion/wasm-image-processor';
import type { WasmImage, SupportedImageFormat } from 'azion/wasm-image-processor';

const image: WasmImage = await loadImage('https://example.com/image.jpg');
const imageResponse: Response = image.getImageResponse('jpeg' as SupportedImageFormat);
console.log(imageResponse);
```

**Parâmetros**:

| Parâmetro | Tipo | Descrição |
| --- | --- | --- |
| `format` | `SupportedImageFormat` | O formato da imagem. Exemplo: `'jpeg'`, `'png'`, `'webp'`. |
| `quality?` | `number` | A qualidade da imagem (para `'jpeg'`). Valor padrão: `100.0`. |

**Retorno**:

| Tipo de retorno | Descrição |
|-------------|-------------|
| `Response` | O objeto de resposta contendo a imagem processada. |

### clean

Limpa os dados da imagem para liberar memória.

Exemplo:

```typescript
import { loadImage } from 'azion/wasm-image-processor';
import type { WasmImage, SupportedImageFormat } from 'azion/wasm-image-processor';

const image: WasmImage = await loadImage('https://example.com/image.jpg');
image.clean();
```
**Retorno**:

| Tipo de retorno | Descrição |
|-------------|-------------|
| `void` | Nenhum valor de retorno. |

---

## Tipos

Esses são os tipos usados pela biblioteca **WASM Image Processor** e seus métodos:

### WasmImage

Uma interface representando uma instância PhotonImage com métodos adicionais para processamento de imagem.

**Propriedades**:

| Propriedade | Descrição |
| --- | --- |
| `image` | A instância PhotonImage. |

**Métodos**:

| Método | Parâmetros | Tipo de Retorno | Descrição |
| --- | --- | --- | --- |
| `width` | - | `number` | Retorna a largura da imagem. |
| `height` | - | `number` | Retorna a altura da imagem. |
| `resize` | `width: number`, `height: number`, `usePercent?: boolean` | `WasmImage` | Redimensiona a imagem. |
| `getImageResponse` | `format: SupportedImageFormat`, `quality?: number` | `Response` | Retorna a imagem processada como uma resposta. |
| `clean` | - | `void` | Limpa os dados da imagem. |

### SupportedImageFormat

Um tipo representando formatos de imagem suportados. Os valores possíveis são:

- `'webp'`
- `'jpeg'`
- `'png'`