Procesamiento de imágenes en Node.js: resize, crop con Sharp y Jimp

Trabajo con imágenes en Node.js: resize y crop

En el desarrollo web moderno, a menudo surge la necesidad de procesar imágenes en el lado del servidor: cambiar el tamaño, recortar, convertir formatos. Node.js ofrece varias librerías potentes para estas tareas. En este artículo analizaremos las dos más populares: Sharp (alto rendimiento, basada en libvips) y Jimp (JavaScript puro, no requiere dependencias nativas).

1. Instalación y preparación

Para empezar, crea un nuevo proyecto e instala una de las librerías:

mkdir image-processor && cd image-processornpm init -ynpm install sharp jimp

2. Cambio de tamaño (resize) con Sharp

Sharp es una librería rápida en C que es ideal para producción. Soporta procesamiento en streaming y detección automática de formato.

const sharp = require('sharp');

// Redimensionamiento simple a 300px de ancho (la altura mantiene la proporción)sharp('input.jpg')  .resize(300)  .toFile('output-300.jpg')  .then(() => console.log('¡Listo!'))  .catch(err => console.error(err));

// Redimensionamiento forzado a dimensiones exactas de 200x200 (con distorsión)sharp('input.jpg')  .resize(200, 200, { fit: 'fill' })  .toFile('output-fill.jpg');

// Redimensionamiento inteligente manteniendo la proporción (recorte centrado)sharp('input.jpg')  .resize(200, 200, { fit: 'cover', position: 'centre' })  .toFile('output-cover.jpg');

3. Recorte (crop) con Sharp

El método extract permite recortar un área rectangular de la imagen.

const sharp = require('sharp');

// Recortamos el á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('Recortado:', info));

4. Trabajo con Jimp (JavaScript puro)

Jimp funciona más lento que Sharp, pero no requiere compilación de módulos nativos, ideal para tareas simples o entornos sin permisos para instalar paquetes del sistema.

const Jimp = require('jimp');

// Redimensionar a 300px de anchoJimp.read('input.jpg')  .then(image => {    return image      .resize(300, Jimp.AUTO) // AUTO mantiene la proporción      .writeAsync('output-jimp.jpg');  })  .then(() => console.log('Redimensionamiento con Jimp listo'))  .catch(err => console.error(err));

// Recorte (crop) con 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. Ejemplo combinado: resize + crop en un solo paso

A menudo se requiere recortar primero y luego reducir el tamaño. Sharp lo hace eficientemente gracias a su 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('Tamaño final:', info.width, 'x', info.height));

6. Comparación Sharp vs Jimp

• Rendimiento: Sharp es de 5 a 10 veces más rápido para archivos grandes.
• Instalación: Jimp no requiere dependencias nativas (solo npm install).
• Funciones: Sharp soporta más formatos (heif, tiff, avif) y filtros avanzados.
• Procesamiento en streaming: Sharp trabaja con streams de Node.js (pipe), Jimp solo con buffers.
• Recomendación: Para servicios de alta carga, elige Sharp. Para scripts simples o proyectos educativos, Jimp.

7. Trabajo con buffer (sin guardar en archivo)

A menudo las imágenes llegan por HTTP o se almacenan en memoria. Ambas librerías soportan trabajar con Buffer:

const sharp = requ