question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Resizing SVGs and converting them to PNGs takes hours for some images

See original GitHub issue

I am using sharp to resize SVG images and output them as PNG. This works fine for a lot of images, but is painfully slow for some others.

I set up a sample project that demonstrates this behaviour: https://github.com/nikwen/sharp-demo

An example image that is very slow is the following: https://openclipart.org/download/172385/1347916868.svg

This is the sharp call I am doing:

sharp('./image.svg')
    .resize(192, 192)
    .background({r: 0, g: 0, b: 0, alpha: 0})
    .embed()
    .png()
    .toBuffer()

On my machine, the aforementioned sharp call with the given image takes 1 hour 55 minutes 46.02 seconds to complete.

I noticed that it takes less time for sizes that are powers of 2 (such as 512x512), but it still takes too long.

System:

  • CPU: Intel Core i5-4570 CPU @ 3.20GHz × 4
  • RAM: 8GB
  • OS: Fedora 27 (Linux kernel 4.16.6)
  • Node.js: 8.11.1

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:10 (4 by maintainers)

github_iconTop GitHub Comments

4reactions
lovellcommented, Oct 4, 2018

sharp v0.21.0 is now available with a prebuilt libvips v8.7.0 that contains the upstream fix.

2reactions
nikwencommented, Oct 9, 2018

@lovell Just to give you an impression of how much of a difference this update made to me: My image processing task went from 2.5 hours to 17 seconds! Thanks a lot! 🎉

Read more comments on GitHub >

github_iconTop Results From Across the Web

SVG to PNG conversion produces pixelated output with height ...
When resizing svg files and converting them to png, the output is really pixelated if the svg file has a height and a...
Read more >
How to resize a SVG image - Medium
Open the SVG file with your text editor. It should show lines of code as below. ... As you can see, width and...
Read more >
SVG vs PNG: What Are the Differences and When to Use Them
SVGs always look crisp and beautiful due to never experiencing quality loss. Raster images can start to look blurry when even slightly resized....
Read more >
How to Scale SVG | CSS-Tricks
SVG looks great at any scale, but it can scale in so many different ... Raster images like JPG, PNG, and GIF, have...
Read more >
Batch convert SVG images to desired size PNG or ICO [closed]
navigate to your "C:\svgs\" and type convert.bat -- All svg-files will be converted to ... It seems however that ImageMagick first rasterizes then...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found