There is a set of images .jpg .png and one .svg

what will be more effective:

<img src='./images/imgindex.png' srcset="./images/imgindex@2x.png 2x, ./images/{imgindex@3x.png 3x" alt=' ' width=33 height=33/> 

or

 <img src='./images/imgindex.svg' alt=' ' width=33 height=33/> 

? ... because the vector will scale without loss of quality, but in the same size and without additional. resources.

can .svg replace a set of images for different conditions? Or, is it possible / better to somehow combine them?

  • Of course, SVG is better ... weighs less - user33274
  • an interesting question, for example, the pixel density plays a small role - user33274
  • @CodeGust, if you are satisfied with my answer, then check the box next to the answer to the left, please. - Bharata

1 answer 1

Everything is relative!

If your SVG consists of the same PNG , then there will be no loss in quality, since the SVG will only expand outwardly "without loss of quality." Then it is not profitable.

If SVG created without using PNG images, then in this case it is more profitable than PNG .