0

In node.js can I take the binary straight from the canvas without calling toDataURL (which would convert it to 3x size base64)?

So I would then have binary (example: open up any image with a text editor)

Then convert that into webp base64 (?)

I've found that converting base64 png to base64 webp is very slow but, transporting webp via websockets is very fast. After a lot of tests though; I see that converting to webp from png then transporting is in fact much slower that just transporting pngs (one example is https://github.com/lovell/sharp which can do the base64 conversion)

If I could just go from canvas to webp then I would be transporting 80% less data in the same time. I would be decreasing the transport time and saving the user mobile bandwidth (if they have a webp supporting browser), if not, (their choice - you-snooze-you-loose) and I fallback to png.

Ben Muircroft
  • 2,936
  • 8
  • 39
  • 66
  • I don't really know about node.js behaviour, but isn't it built upon chromium? Then it may support `canvas.toDataURL('image/webp', width, height, quality)`. Also, you may consider using `'image/jpeg'` and the 0-1 quality parameter. and finally, you may want to [convert this base64 dataURL to a blob](http://stackoverflow.com/questions/4998908/convert-data-uri-to-file-then-append-to-formdata/5100158#5100158), which should end in lighter data transfer. – Kaiido Sep 03 '15 at 01:07
  • no node.js doesn't have a canvas only through a few modules is it supplied. image/jpeg is not the same as png in that it does not support transparency. to convert it to a blob would mean my transport would have to binary and my application wouldn't handle binary messages as the messages have to have a message name. – Ben Muircroft Sep 03 '15 at 22:31
  • Hum webp from canvas doesn't seem to support transparency either. And I didn't get the name thing... (You can send this blob as a file then) – Kaiido Sep 03 '15 at 23:02

0 Answers0