exupero / saveSvgAsPng

Save SVGs as PNGs from the browser.
MIT License
1.09k stars 362 forks source link

@font-face ignore #169

Closed nbob closed 6 years ago

nbob commented 6 years ago

How to ignore @font-face in my styles while svgAsPngUri calling?

I have many svg images (about 50) on my page and I need to transform them into png uri. After every calling svgAsPngUri I get 10 requests of font files. In my case I don't need fonts at all, but I get 500 extra http requests and 50mb extra payload.

Is it possible to ignore fonts for saveSvgAsPng library?

exupero commented 6 years ago

I've published version 1.4.1 with support for a fonts option. You may give it an empty list to disable font inlining. Let me know if you run into any problems.

Ataraxy commented 6 years ago

I tried passing an empty array to the 'fonts' option but still get attempts at loading external stylesheets.

Otherwise, could you kindly offer up an example of using an external font with the newly added option?

For example with something like this "http://fonts.gstatic.com/s/alegreya/v10/4UaBrEBBsBhlBjvfkRLm.ttf"

Thanks

Edit:

I've actually figured out a seperate solution for myself which basically comes down to downloading the font and converting it to base64 to then embed the @font-face style directly into the SVG's defs. Doing this enables me to convert the SVG to Canvas manually and proceed.

Sadly it still doesn't help with the style sheets still attempting to load through a blank fonts options.

exupero commented 6 years ago

Specifying the fonts option only prevents inlining of fonts. The script will still read all stylesheets looking for CSS rules that affect the SVG.

I've published version 1.4.2 that caches stylesheets so they're only loaded once. It also attempts to cache fonts, but may be subject to race conditions if you're saving a lot of PNGs at once. Let me know how it works for you, and if you have trouble with the new caching logic, feel free to open a new issue.