Why we switched from graphicsmagick to Sharp for node image processing

As we know Node is not the best tool in town to deal with long data-operations. At twebcast, a realtime audience interaction platform, one of the features we provide is the ability to upload photos.

One primary example is that an audience upload a selfie, for example, at a social event and the participants photos will appear in a collage on a large screen at the venue. Our image features can also work with instagram or twitter but the main case is that customers want to upload images within a private Twebcast event.

Using my iPhone 7+ an image will be 12Mpx, although pretty heavily compressed. So it will weigh somewhere around 1.5 to 4MB.

This is the original and it is uploaded to our image-server. After that we need to:

• Rotate based on EXIF.
• Create a resized version where width or height cannot exceed 1200px (large version)
• Create a crop of 1000x1000px that can be used in e.g. image collage
• Create a thumbnail with existing proportions for use in our moderation panels and chat flows etc.

We have used the imagemagick wrapper graphicsmagick for node. The above operation with above mentioned iPhone image would take somewhere arround 4–7 seconds in total.

The best way to create a quicker and more flexible solution is to utilize AWS Lambda. Serverless function in the cloud featuring almost unlimited scalability. However.. this requires a lot of code rewrite not to mention lots of devops work.

SOO…

I stumbled upon Sharp http://sharp.dimens.io a great alternative to graphicsmagick which is more focused around resizing, rotating, cropping and pretty simple color/channel adjustments. A simple npm install..

It is blazing fast compared to graphicsmagick.

The above mentioned image processes that took between 4–7 seconds with graphicsmagick will take no more than 1 second with Sharp. Thats a 4–7 times increas in speed by just replacing which NPM modules we use for the same work.

Best of all is that the code we had to change was minimal. write() is toFile() and suchforth. It took maybe 1.5 hours in total to do the switch.

For our clients this means that we can have much larger audiences uploading photos with a near realtime experience!

The next step is to move image handling over to AWS Lambda for a “serverless” setup where we will be able to have a much more flexible handling including storage and scaling.