rotate - resize image node js

Node.js: redimensionamiento de imagen sin ImageMagick

Question

Estoy desarrollando una aplicación web en Node.js (+ express 4) donde los usuarios pueden configurar su imagen de perfil cargándola en el servidor. Ya limitamos el tipo de archivo mimet y el máximo tamaño de archivo, por lo que el usuario no puede cargar más de 200 KB de imágenes png o jpeg.

El problema es que queremos cambiar el tamaño (en el servidor) de la resolución de imagen cargada a 200x200 para mejorar la carga de la página y ahorrar espacio en el disco. Después de algunas investigaciones, todas las respuestas apuntaban al uso de cualquier módulo basado en ImageMagick o GraphicsMagick.

Sin embargo, tener que instalar ImageMagick / GraphicsMagick para hacer un cambio de tamaño de imagen simple parece demasiado exagerado para mí, entonces, ¿hay alguna otra solución que no sea esto para Node.js?

Answer 1

Canvas es 2,3 veces más rápido que ImageMagic.

Puede intentar comparar los módulos de Node.js para la manipulación de imágenes - https://github.com/ivanoff/images-manipulation-performance

author''s results:
 sharp.js : 9.501 img/sec; minFreeMem: 929Mb
 canvas.js : 8.246 img/sec; minFreeMem: 578Mb
 gm.js : 4.433 img/sec; minFreeMem: 791Mb
 gm-imagemagic.js : 3.654 img/sec; minFreeMem: 804Mb
 lwip.js : 1.203 img/sec; minFreeMem: 54Mb
 jimp.js : 0.445 img/sec; minFreeMem: 82Mb

Answer 2

Eche un vistazo a lwip: https://github.com/EyalAr/lwip

Muy simple y facil de usar

npm install lwip

y luego en tu código de nodo,

// obtain an image object:
require(''lwip'').open(''image.jpg'', function(err, image){

  // check err...
  // define a batch of manipulations and save to disk as JPEG:
  image.batch()
    .scale(0.75)          // scale to 75%
    .rotate(45, ''white'')  // rotate 45degs clockwise (white fill)
    .crop(200)            // crop a 200X200 square from center
    .blur(5)              // Gaussian blur with SD=5
    .writeFile(''output.jpg'', function(err){
      // check err...
      // done.
    });

});

Lo he implementado con éxito en mi cargador de archivos y funciona como un encanto.

Answer 3

Estaba usando lwip (como previamente sugirió arvind) pero cambié a png-crop . Parece que funciona un poco más rápido para mí (Win 8.1 x64, Node v0.12.7). El código en el repositorio se ve increíblemente liviano, y operacionalmente es simple de usar.

var pngcrop = require(''png-crop'');
var config = {left: 10, top: 100, height: 150, width: 150};
pngcrop.crop(''cats.png'',''cats-cropped.png'',config);

Por supuesto, solo hará archivos png ...

Answer 4

Hay una buena biblioteca de manipulación de imágenes escrita completamente en JavaScript, sin dependencias con ninguna otra biblioteca, Jimp. https://github.com/oliver-moran/jimp

Ejemplo de uso:

var Jimp = require("jimp");

// open a file called "lenna.png"
Jimp.read("lenna.png", function (err, lenna) {
    if (err) throw err;
    lenna.resize(256, 256)            // resize
         .quality(60)                 // set JPEG quality
         .write("lena-small.jpg"); // save
});

Answer 5

Recientemente comencé a desarrollar un módulo de procesamiento de imágenes para NodeJS sin dependencias de tiempo de ejecución ( lea por qué ). Todavía está en etapas tempranas, pero ya se puede usar.

Lo que está pidiendo se haría de la siguiente manera:

image.resize(200, 200, function(err, image){
    // encode resized image to jpeg and get a Buffer object
    image.toBuffer(''jpg'', function(err, buffer){
        // save buffer to disk / send over network / etc.
    });
});

Más información en el repositorio de Github del módulo.

Answer 6

Si no necesita una imagen grande, puede redimensionarla en el lado del cliente antes de cargarla:

Leer archivos en JavaScript usando las API de archivos

Redimensionamiento de la imagen del lado del cliente con javascript antes de subirlo al servidor

Muchos usuarios pueden tener una buena imagen de sí mismos desde un teléfono inteligente, y muchos de ellos tienen más de 200kB. Tenga en cuenta que los datos proporcionados por el cliente no son confiables, por lo que las verificaciones del lado del servidor aún se aplican.

Answer 7

Yo votaría por sharp :

sharp(''input.jpg'')
  .resize(200, 200)
  .toFile(''ouput.jpg'', function(err) {
    // output.jpg is a 200 pixels wide and 200 pixels high image
    // containing a scaled and cropped version of input.jpg
  });

Es rápido, típicamente 5 veces más rápido que los enlaces de nodo basados ​​en imagemagick más rápidos , y se ejecuta en muy poca memoria, tal vez 10 veces menos . enlaces directos a la biblioteca de imágenes libvips directamente, no hay bombardeos a un programa externo, y la biblioteca es más rápida y más eficiente que * magick en esta tarea. Es compatible con cosas útiles como flujo, búfer y sistema de archivos de entrada y salida, gestión del color, transparencia, promesas, superposiciones, WebP, SVG y más.

A partir de cero 0.20, npm descargará automáticamente binarios precompilados completos en la mayoría de las plataformas, por lo que no hay necesidad de node-gyp. Simplemente ingrese:

npm install sharp

o:

yarn add sharp

Y listo.

Answer 8

sharp ha disfrutado de cierta popularidad recientemente, pero es la misma idea que * bindings Magick.

Sin embargo, tener que instalar ImageMagick / GraphicsMagick para hacer un cambio de tamaño de imagen simple parece demasiado exagerado para mí

El cambio de tamaño de la imagen es cualquier cosa menos simple. El formato JPEG es particularmente complejo, y hay varias formas de escalar gráficos con resultados de calidad variable, algunos de ellos fáciles de implementar. Existen bibliotecas de procesamiento de imágenes para hacer este trabajo, por lo que si no hay otra razón por la cual no pueda instalarlas, vaya a buscarlas.