JS操作图片的利器:Jimp VS GM

前段时间,笔者有一个项目需求,需要在一张图片上面添加文件,并另存为一张新的图片。刚开始的时候,笔者使用的是大名鼎鼎的jimp。
JS操作图片的利器:Jimp VS GM_第1张图片

其功能能满足我的要求,而且其license是MIT,不依赖于第三方的可执行程序,纯粹的javascript的实现,目前有6809颗,可以说是相当于受欢迎的,而且在其里面提的任何的问题,其开发人员都会在8个小时内回复我,的的确确在功能上是非常的满意,也满足我的功能需求。比如,下面就是一个示范的代那个码,用来在一张已知的图片上添加特定的文字。

var Jimp = require('jimp');
Jimp.loadFont("C:\\nodejs\\node_modules\\jimp\\fonts\\montserrat\\montserrat-28-white\\montserrat-28-white.fnt").then(function(font) {
    image.print(font,24, 24, 'Hello Jim')
    .print(font,24, 180, '08/05/2018');
    Jimp.loadFont("C:\\nodejs\\node_modules\\jimp\\fonts\\open-sans\\open-sans-36-white\\open-sans-36-white.fnt").then(function(font) {
     Jimp.loadFont("C:\\nodejs\\node_modules\\jimp\\fonts\\montserrat\\montserrat-36-white\\montserrat-36-white.fnt").then(function(font) {
         image.print(font, 24, 220, 'Welcome Tom')
         image.print(font, 24, 220, 'Welcome Peter')
        .resize(266,139)
         .write('target.png');
 });

其还支持各种自己定义的字体。按理来说,其应该功成名就,满足我的要求。但是
等项目完成之后,我才发现,其性能满足不了我的要求,因为我的项目需要在1秒内生成10张左右的带自定义字的图片;使用Jimp,每生成一张图片,要花将近1秒的时间。

后面经过研究,发现gm的效率非常的高。在1秒内完全能够同时生成10张带文字的合成图片。

其Github地址为:https://github.com/aheckmann/gm

JS操作图片的利器:Jimp VS GM_第2张图片

从上面看出,其有5225个星,和Jimp得到的赞誉也是不相上下。不过,其是利用javascript调用第三方的可执行程序实现的,所以其效率当然比jimp要快一个数量级。在使用前要安装:GraphicsMagick 或者 ImageMagick

JS操作图片的利器:Jimp VS GM_第3张图片

JS操作图片的利器:Jimp VS GM_第4张图片

安装完之后,其代码的使用也是非常的简单,下面是其在一张已知的图片上继续添加文字的示范代码。

var fs = require('fs')
  , gm = require('gm');
let start=new Date().getTime();
gm('\assets\\test.png')
.stroke("#ffffff")
//.drawCircle(10, 10, 20, 10)
.font("Helvetica.ttf", 28)
.drawText(30, 20, "GMagick!")
.write("drawing.png", function (err) {
    console.log(err)
  if (!err) console.log('done');
  let start1=new Date().getTime();
  console.log("*******",start1-start)
});

是不是带也很简单简洁,不过唯一麻烦一点的就是要装一个第三方的可执行程序:GraphicsMagick 或者 ImageMagick,不过其运行的性能和效率是杠杠的。

好了,夜深了,笔者也要休息了,下次再续!

你可能感兴趣的:(web前端)