Ways to convert images to base64 in javascript?

Question

JavaScript

Good evening!
How to convert image to base64 in JS browser.
I found a way using canvas, they say it increases (more than 1/3) the size.
In general, it doesn’t matter how you compress an image and convert it to base64 on the client or server side (node.js), the main thing is to get base64 in the end.
Thank you! :)
ps: more precisely, I'm looking for a way to convert an image to a string, so that I can use it on the page later. Is there something alternative to base64?

Answer 1

Found a way using canvas, they say it increases (more than 1/3) the size

Well, as it were ... it's not because it's through canvas, but because it's base64. But it's quick and easy.
Purely theoretically, you can upload a file to Blob and encode it in base64 there, google it, there are ready-made functions.
But I don't recommend this. This is only valid for small images, icons for example, and there are more convenient approaches for icons (svg, icon fonts). Large pictures, if you need to somehow keep them offline in the cache, it is better to keep them in local file storage (there are libraries, for example, image cache for chrome). Base64 images eat up a lot of resources.