Is it safe to use base64 encoded images for web design, How does it compare in performance? Advantages and Disadvantages?
By consisting only of ASCII characters, base64 strings are generally url-safe, and that's why they can be used to encode data in Data URLs.
Generally no. Base64 will occupy more space than necessary to store those images. Depending on the size of your images and how frequently they're accessed, it is generally not an optimal stress to put on the database. You should store them on the file system or in something like Azure blob storage.
Base64 encoding schemes are commonly used when there is a need to encode binary data that needs to be stored and transferred over media that are designed to deal with ASCII. This is to ensure that the data remain intact without modification during transport.
That's a horrible thing to do. Base64 is very space-inefficient. It was designed in part to email binary data between incompatible computers whose byte sizes could be as small as 6 bytes. So typically a Base64 translation of data will be at least twice as big as the original data.
A base64 stream is about 33% heavier than a binary one (not taking into account the gzip compression over http that you have in place if you're serious about performances).
If you put the base64 image directly in a page, it won't be cached separately. So it will be heavy for all pages using this image instead of being cachable with URL as key. You may think that it helps keeping the request number low but in fact it's useless in normal cases where users have yet the images in their cache (if you have many images, prefer css sprites to lower the number of requests).
I don't think there is a reason to use a base64 image except for when addressing a specific technical issue, like sending an image in json, or saving only one html file - and then check you really need to use the base64 image.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With