Trabalhando com imagens em Node.js: redimensionar e cortar
No desenvolvimento web moderno, surge frequentemente a necessidade de processar imagens no lado do servidor: redimensionar, cortar, converter formatos. O Node.js oferece várias bibliotecas poderosas para essas tarefas. Neste artigo, abordaremos as duas mais populares — Sharp (alta performance, baseada em libvips) e Jimp (JavaScript puro, sem dependências nativas).
1. Instalação e preparação
Para começar, crie um novo projeto e instale uma das bibliotecas:
mkdir image-processor && cd image-processornpm init -ynpm install sharp jimp2. Redimensionamento (resize) com Sharp
Sharp é uma biblioteca rápida em C, ideal para produção. Ela suporta processamento em stream e detecção automática de formato.
const sharp = require('sharp');
// Redimensionamento simples para largura de 300px (altura mantém proporção)sharp('input.jpg') .resize(300) .toFile('output-300.jpg') .then(() => console.log('Pronto!')) .catch(err => console.error(err));
// Redimensionamento forçado para tamanhos exatos 200x200 (com distorção)sharp('input.jpg') .resize(200, 200, { fit: 'fill' }) .toFile('output-fill.jpg');
// Redimensionamento inteligente mantendo proporções (corte centralizado)sharp('input.jpg') .resize(200, 200, { fit: 'cover', position: 'centre' }) .toFile('output-cover.jpg');3. Corte (crop) com Sharp
O método extract permite recortar uma área retangular da imagem.
const sharp = require('sharp');
// Recortando a área: left=100, top=50, width=400, height=300sharp('input.jpg') .extract({ left: 100, top: 50, width: 400, height: 300 }) .toFile('cropped.jpg') .then(info => console.log('Cortado:', info));4. Trabalhando com Jimp (JavaScript puro)
Jimp é mais lento que Sharp, mas não requer compilação de módulos nativos — ideal para tarefas simples ou ambientes sem permissão para instalar pacotes do sistema.
const Jimp = require('jimp');
// redimensionar para largura de 300pxJimp.read('input.jpg') .then(image => { return image .resize(300, Jimp.AUTO) // AUTO mantém proporções .writeAsync('output-jimp.jpg'); }) .then(() => console.log('Redimensionamento com Jimp pronto')) .catch(err => console.error(err));
// crop (corte) com coordenadasJimp.read('input.jpg') .then(image => { return image .crop(100, 50, 400, 300) // x, y, width, height .writeAsync('cropped-jimp.jpg'); }) .catch(err => console.error(err));5. Exemplo combinado: resize + crop em uma única passagem
Frequentemente é necessário primeiro cortar e depois reduzir. O Sharp faz isso de forma eficiente graças ao seu pipeline interno:
const sharp = require('sharp');
sharp('input.jpg') .extract({ left: 50, top: 30, width: 800, height: 600 }) .resize(400, 300, { fit: 'cover' }) .toFile('result.jpg') .then(info => console.log('Tamanho final:', info.width, 'x', info.height));6. Comparação Sharp vs Jimp
- Desempenho: Sharp é 5 a 10 vezes mais rápido para arquivos grandes.
- Instalação: Jimp não requer dependências nativas (apenas npm install).
- Funcionalidades: Sharp suporta mais formatos (heif, tiff, avif) e filtros avançados.
- Processamento em stream: Sharp trabalha com streams do Node.js (pipe), Jimp apenas com buffers.
- Recomendação: Para serviços de alta carga, escolha Sharp. Para scripts simples ou projetos educacionais, use Jimp.
7. Trabalhando com buffer (sem salvar em arquivo)
Frequentemente as imagens chegam via HTTP ou são armazenadas em memória. Ambas as bibliotecas suportam trabalho com Buffer:
const sharp = requ