Image Data URIs mit PHP

Image Data URIs sind für manche Anwendungen eine feine Sache. Wozu braucht man die kleinen Helfer? Einfach ausgedrückt: direktes Einbetten von Bildern in eine Seite oder CSS ohne einen zusätzlichen HTTP-Request zu verursachen. Nähere Informationen gibt es bei Wikipedia, besonders geeignet sind die Teile natürlich um kleine Icons direkt einzubetten. Was natürlich nicht schön ist, ist die Tatsache das man zum Beispiel eine Grafik erstmal base64 encoden müsste, um sie zu verwenden. Besonders unschön wird es, wenn man merkt, das Grafiken zu aktualisieren sind.

Beispiel eines Bildes als Data URI

Clever wie wir sind, und auch immer interessiert an der Beschleunigung der Auslieferung einer Webseite kann man das ganze natürlich auch mittels PHP schnell in eine Seite integrieren:

// A few settings
$image = 'logo.jpg';
$imageData = base64_encode(file_get_contents($image));
$src = 'data: '.mime_content_type($image).';base64,'.$imageData;
echo '';

Die %27 sind hierbei übrigens die ‚ – einfach eine Möglichkeit den Image-Src trotzdem noch valide auszugeben, ohne sich in PHP die Finger brechen zu müssen. Wenn man das Ganze in eine Function verpackt und diese in einem Projekt allen Seiten zur Verfügung stellt, kann man mit Sicherheit einen guten Performance-Gewinn erzielen!

Ähnliche Beiträge


Vergleich von PHP-Entwicklungsumgebungen
PHP-Entwicklungsumgebungen gibt es inzwischen wie Sand am Meer. Jede behauptet von sich die einzig wahre zu sein, und natürlich ist es fast unmöglich ...


PHP Code Snippets für komplexere Aufgaben
Wieso das Rad neu erfinden? Große Teile einer Umsetzung bedeuten Copy&Paste - wer was anderes behauptet - naja - macht sich entweder zu viel Arbei...


Cookies sind ja so was von 2012 …
Sagen wir mal so: die Intention von Cookies ist ganz nett, die Tatsache wie sie heute genutzt werden eher nicht. Ein Cookie ist immer an eine Domain g...


PHP beschleunigen mit phpFastCache
Je höher die Besucher-Zahlen einer Seite werden, desto mehr Probleme fängt man sich ein. In der Regel kommt man heutzutage auf die Idee, langsamen Web...

Kommentare

    1. Autor
      des Beitrages
  1. Markus

    Ich bekomm leider immer noch Fehler. :-(

    Ich nutz jetzt die in Deinem verlinkten Wiki Artikel beschriebene Möglichkeit. Ist da ein großer Unterschied?

  2. Autor
    des Beitrages
    Guido

    Seht ihr, so etwas passiert wenn man seinen Code nicht ausprobiert ;) Ich habs jetzt zwar immer noch nicht ausprobiert, aber den Code verschlimmbessert! ;)

  3. Markus

    Ok so meint ich es ja. Deine Frage war da nicht ganz eindeutig für mich. Ich komm mit dem obigen Code bisher auch nicht wirklich klar.

  4. Enno

    Also entweder ihr versteht mich nicht oder – was ich eher vermute – ich stehe ganz schön auf der Leitung.

    $variable = „mein Wert“;
    echo „Test, $variable“; // Test, mein Wert
    echo ‚Test, $variable‘; // Test, $variable

    Doppelte Anführungszeichen = Variable wird geparst.
    Einfache Anführungszeichen = Variable wird nicht geparst.

    So habe ich es gelernt, so war es schon immer. Oder nicht?

    Im obigen Beispiel steht $src zwischen einfachen Anführungszeichen, dementsprechend wird die Variable nicht geparst sondern einfach ausgegeben, als wenn es Text wäre. Das hat ja auch mein Test ergeben.

    Mittlerweile bin ich leicht verwirrt, wäre nett, wenn jemand die Güte hätte Licht ins Dunkel zu bringen :)

  5. Markus

    @Enno das ist ein gewaltiger Unterschied ob Hochkommata oder doppelte Anführungszeichen. Google mal, wirst schnell fündig.

  6. Enno

    Doch, doch, PHP läuft schon. Aber seit wann lassen sich den Variablen in einfachen Anführungszeichen angeben? In doppelten kenn ich ja, aber in einfachen?

  7. Autor
    des Beitrages
    Guido

    @Enno Wenn da nur ein $str ausgegeben wird, stimmt was nicht mit deiner PHP Konfiguration oder sonst etwas. Kann es sein das da PHP erst gar nicht anspringt? ;)
    @Markus hat natürlich recht, richtiger wäre an der Stelle ein finfo_open(FILEINFO_MIME_TYPE);

  8. Markus

    Nette Sache, hab gleich mal ein wenig rumgespielt. mime_content_type ist allerdings veraltet und man sollte auf finfo_open(FILEINFO_MIME_TYPE); ist es glaub ich, setzen.

  9. Enno

    Ich hatte in den Kommentar HTML-Code eingefügt, der nicht übernommen wurde.
    Ich verstehe die Sache mit dem %27, nicht so richtig. Warum nimmst du für das echo nicht doppelte Anführungszeichen („) und für das Attribut src dann einfache (‚)? Damit würdest du doch das %27-Gedöns leichter umgehen, oder?

  10. Autor
    des Beitrages
    Guido

    @Tom: Ich gehe mal davon aus das man in der heutigen Zeit alle Seiten cached die man ausliefert ;)
    @Enno: Wer hat wen gefressen? ;) Ansonsten: da sind schon ‚ vom echo des PHP

  11. Tom

    Dann werden die Bilder bei jedem Aufruf neu codiert. Belastet den Server ja unnötig.
    Um hier noch die Performance zu erhöhen müsste ein Cache der base64-Daten dazu, oder?

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.