avantages et inconvénients des chaînes d'image base64
J'ai découvert qu'il est possible de convertir des images en chaînes base64 et de les utiliser dans les balises img et css comme suit:
<img alt="" src="data:image/png;base64,iVBORw0KGgoAhEUgAAA ... FTkSuQmCC" />
ou ca:
background-image: url(data:image/png;base64,iVBORw0KGgoAAAA ... uQmCC);
Servir des images de cette manière semble améliorer les temps de chargement des sites Web, mais peut présenter des inconvénients. J'ai quelques questions sur cette méthode:
- Le navigateur mettra-t-il en cache ces images?
- Est-il plus rapide pour une page de restituer cette chaîne ou un fichier image?
Je suis intéressé par d'autres avantages ou inconvénients impliquant cette méthode de traitement d'image.
Le navigateur mettra-t-il en cache ces images?
Qu'entendez-vous par mise en cache dans ce contexte? Les navigateurs cachent les fichiers statiques pour ne pas avoir à les redemander. Si les données d'image sont fournies en ligne dans la page HTML elle-même, aucune mise en cache n'est requise.
Si les données d'image sont fournies dans la feuille de style, étant donné que la feuille de style elle-même sera mise en cache, les données d'image sont mises en cache avec elle.
Est-il plus rapide pour une page de restituer cette chaîne ou un fichier image?
Je suppose que la différence est négligeable et ne mérite pas d’être prise en compte.
De plus, pour répondre à une question de votre commentaire, je ne considérerais généralement l’intégration des données d’image dans la source HTML que dans les cas où de très petites images ne sont utilisées que sur cette page.