I make a gallery. It is easier for me to store pictures on the server in base64. Is there any difference when displaying the image in html between specifying the path to the image in the src attribute or substituting the base64 string into this tag in terms of performance or something else?

  • And why is it easier for you to store in base64, do you store them in the database? Do not store pictures in the database, they will take less space in the form of files, hence the network will be transferred to the client faster over the network. And besides this, the return of a static image by means of a web server is much faster than an independent return by a script - Mike
  • I did not write correctly, I will not store it but transfer it from the client to the server, since there the crud form with the gallery is there, I thought I could write to the database right away, but now judging by the answers I’ll save in the form of pictures - heff

2 answers 2

stored on the server, is it in the database? if you have less large images, save as static files. why every time to drive the contents of files through the connection base here? she already takes most of the load on herself.

if you use base64, then

  • images are not cached, but sent along with HTML. Ie the user will wait until 5 megabytes of the page is loaded and rendered. Instead of displaying content and styles, and everything else is parallel to load (and browsers are able to show a thumbnail before full image loading)
  • You can use server-side GZIP, many times reducing the size of the received content.
  • static files in order to optimize taken to give the CDN. it uploads content from a closer server, speeding up the download. also put NGINX (just before apache), which quickly works with stat. files. this option does not work in base64

    if you specify the path to the picture, the browser will need to make another request and download the picture. This is like a minus, but modern browsers are able to do it very well (if only they do not interfere) and download to the parallel. Also, the map is easy to cache. In the event that the picture is inside the html page, the caching of the picture is impossible, the html page itself becomes larger. But if the picture is small (10 to 10 pixels), then this may be justified.

    Since you are making a gallery, it is better to use the classical approach for basic pictures (large). It will be easier, faster (in terms of design and display) and more flexible. Small pictures (all kinds of arrows) can be inserted inside the html, but I don’t see it as a nickname of this.

    On the server, it’s still better to store files with files — this is at least 25 percent smaller in size (relative to the base64 version).

    The method of storing pictures inside the page is justified only if

    • you are expensive to install a new connection (both in money and in time)
    • I want to save the page as one file with pictures together.