Data-URI für Inline-Grafiken

H G · **H G** » 22.02.2017, 15:09 **Data-URI für Inline-Grafiken**

Moin Moin,

welche Vor/Nachteile (auch in Bezug auf Google) bieten Data-URI- für Inline-Grafiken ?

Falls jemand, außer mir, damit bis jetzt nichts anfangen kann, hier eine Gerator der das Bild als Code ausspuckt und so direkt eingebunden werden kann:

https://www.fastix.org/test/Data-URL-Generator.php

Gruß
H G

Can · **Can** » 22.02.2017, 15:53 **Data-URI für Inline-Grafiken**

Lohnt sich in der Regel nur bei Spezialfällen. z.B. wenn die Bilder so klein sind, dass der Overhead von HTTP/1 überwiegt.

Würde dann Sprites bevorzugen oder halt einfach HTTP/2

nerd · **nerd** » 23.02.2017, 11:11 **Data-URI für Inline-Grafiken**

Vorteil ist, dass du die bilder quasi direkt mit der webseite auslieferst, und der browser das bild nicht spaeter extra anfordern muss.
Nachteil ist, dass solche base-64 inhalte immer ~25% groesser sind als die original datei, und sie koennen anders als normale bilder nicht einzeln gecacht werden, sondern eben nur zusammen mit der ganzen seite.

Sowas macht eigentlich nur sinn wenn du viele kleine (<5kb?) icons mit wenig farben und ohne alpha-transparenz hast.

Dazu brauchst du allerdings keinen externen dienst, sowas kannst du mit ein paar zeilen PHP auch selbst aus jedem beliebigen bild selbst generieren:
https://stackoverflow.com/questions/396 ... 4-encoding

H G · **H G** » 23.02.2017, 13:58 **Data-URI für Inline-Grafiken**

Danke für eure beiden Antworten!

H G · **H G** » 23.02.2017, 16:14 **Data-URI für Inline-Grafiken**

Nachtrag:

Wäre es auch für Signaturen geeignet? Also um ein Logo nicht von einer externen Quelle laden zu müssen?

Can · **Can** » 23.02.2017, 19:32 **Data-URI für Inline-Grafiken**

Nein. Es ist für 99% der Anwendungsfälle nicht geeignet und stellt sogar eine wesentliche Verschlechterung dar. (Initialer Request enorm verzögert, Overhead, Caching usw). Lass es einfach weg.

H G · **H G** » 24.02.2017, 08:10 **Data-URI für Inline-Grafiken**

Okay, danke!