Du bist nicht angemeldet. Der Zugriff auf einige Boards wurde daher deaktiviert.

#1 09. September 2016 07:42

Andynium
Moderator
Ort: Dohna / SN / Deutschland
Registriert: 13. September 2010
Beiträge: 7.017
Webseite

[Plugin] base64_image

Vor einigen Jahren wurde hier mal ein Plugin veröffentlicht, mit dem sich Bilder in Data URLs konvertieren lassen.

https://www.cmsmadesimple.de/forum/view … 2859#p2859

Hab es gerade mal für ein Kundenprojekt rausgekramt, etwas aktualisiert und zu einem vollwertigen CMS/ms-Plugin transformiert (also mit Hilfe-Text wink).

https://dl.orangedox.com/vxbbHwE9nAwkB1 … _image.zip

Einfach auf den Server in das /plugins Verzeichnis hochladen und gut ist.

Und für alle, die nicht wissen, wofür das Plugin gut ist, hier mal ein kleiner Auszug aus der Hilfe

Das Plugin erzeugt aus einem beliebigen Bild in den Formaten JPEG, PNG und GIF eine Base64 kodierte Variante (=String). Damit lässt sich die Performance einer Webseite erhöhen, da nicht mehr für jedes einzelne Bild eine Anfrage beim Server erforderlich ist, sondern die Bilder in den regulären HTTP-Datenstrom eingebettet werden (siehe Data URL's).

Offline

#2 18. September 2016 12:35

owr_web
Server-Pate
Registriert: 16. Dezember 2010
Beiträge: 543

Re: [Plugin] base64_image

Hätte da mit einer Zeile Änderung und anschließendem Test die '(bei mir) funktionierende Version für V2.x:

Hab sie der Übersichtlichkeit halber im Code auch als V2.0 tituliert mit Hinweis auf die Anpassung:

https://dl.orangedox.com/ZzuADW2vfrj8FtRBUg

Offline

#3 19. September 2016 08:58

Janl
Server-Pate
Ort: Freistadt, Österreich
Registriert: 13. Dezember 2010
Beiträge: 1.227
Webseite

Re: [Plugin] base64_image

Danke!

Wenn das ebenso mit SVG möglich wäre, könnte bei grösseren Grafiken viel gewonnen werden.

Was glaubt ihr, geht das oder gibt es dann Probleme mit Versionen in SVG  und Browser-Unterstützung?

MfG
Jan


Ubuntu 16.04 KDE - Kubuntu 18.04 / win10 (1 duo-boot laptop)- LAMP
Raspi 4b mit Ubuntu 20.04 (64bit) und Mate.

Offline

#4 19. September 2016 12:14

NaN
Moderator
Ort: Halle (Saale)
Registriert: 09. November 2010
Beiträge: 4.435

Re: [Plugin] base64_image

Lies mal hier: https://css-tricks.com/probably-dont-base64-svg/ (english)
SVG muss nicht Base64 kodiert werden. Es ist ja bereits XML - also "plain Text".
D.h. das hier sollte ausreichen:

... data:image/svg+xml;utf8,<svg ...> ... </svg> ...

IE 10/11/Edge sollen damit aber Probleme haben (wegen XML in HTML), soll sich aber mit einem Trick umgehen lassen, indem man die SVG-Daten URL-Kodiert:

... data:image/svg+xml;utf8,%3Csvg ... %3E ... %3C/svg%3E ...

Module: GBFilePicker, AdvancedContent
Sicherheit: Beispiel .htaccess-Datei
CMSms 1.12 unter PHP 7:
cmsms-1.12.3.zip (inoffiziell - komplett inkl. Installer)
CMSms 1.12 unter PHP 8:
cmsms-1.12.4.zip (inoffiziell - komplett inkl. Installer)

Offline

#5 19. September 2016 12:27

Andynium
Moderator
Ort: Dohna / SN / Deutschland
Registriert: 13. September 2010
Beiträge: 7.017
Webseite

Re: [Plugin] base64_image

Der Name des Plugins ist in gewisser Weise irreführend - grundsätzlich sollte sich damit jede Datei base64-kodieren lassen.

Von daher sollte es auch mit SVG-Dateien funktionieren, siehe die hier angegebene Alternative

https://wiki.selfhtml.org/wiki/SVG/Einb … ung_in_CSS

Grrmmll, zu langsam gewesen ...

Beitrag geändert von Andynium (19. September 2016 12:30)

Offline

#6 19. September 2016 12:34

Andynium
Moderator
Ort: Dohna / SN / Deutschland
Registriert: 13. September 2010
Beiträge: 7.017
Webseite

Re: [Plugin] base64_image

NaN schrieb:

IE 10/11/Edge sollen damit aber Probleme haben (wegen XML in HTML), soll sich aber mit einem Trick umgehen lassen, indem man die SVG-Daten URL-Kodiert:

Würde nicht auch eine base64 Kodierung IE & Co "austricksen"?

Offline

#7 19. September 2016 12:55

NaN
Moderator
Ort: Halle (Saale)
Registriert: 09. November 2010
Beiträge: 4.435

Re: [Plugin] base64_image

Würde nicht auch eine base64 Kodierung IE & Co "austricksen"?

Ja schon, aber wie im Artikel schon steht, wären die SVG-Daten dann ca. um 1/3 größer als nötig. Und wenn man bedenkt, dass man diese ganze base64-Sache ja größtenteils aus Performancegründen macht, warum also etwas base64 kodieren, was nicht kodiert werden muss. Die URL-Kodierung macht das SVG zwar auch etwas größer, aber das ist m.M.n. zu vernachlässigen. Dafür funktionert es aber bei allen Browsern.


Module: GBFilePicker, AdvancedContent
Sicherheit: Beispiel .htaccess-Datei
CMSms 1.12 unter PHP 7:
cmsms-1.12.3.zip (inoffiziell - komplett inkl. Installer)
CMSms 1.12 unter PHP 8:
cmsms-1.12.4.zip (inoffiziell - komplett inkl. Installer)

Offline

#8 29. September 2021 18:38

Andynium
Moderator
Ort: Dohna / SN / Deutschland
Registriert: 13. September 2010
Beiträge: 7.017
Webseite

Re: [Plugin] base64_image

Andynium schrieb:

Vor einigen Jahren wurde hier mal ein Plugin veröffentlicht, mit dem sich Bilder in Data URLs konvertieren lassen.

https://www.cmsmadesimple.de/forum/view … 2859#p2859

Hab es gerade mal für ein Kundenprojekt rausgekramt, etwas aktualisiert und zu einem vollwertigen CMS/ms-Plugin transformiert (also mit Hilfe-Text wink).

https://dl.orangedox.com/vxbbHwE9nAwkB1 … _image.zip

Einfach auf den Server in das /plugins Verzeichnis hochladen und gut ist.


Aufgrund Eigenbedarf hab ich das Format webp der Dateiliste hinzufügt - vielleicht braucht es noch jemand außer mir  big_smile

https://drive.google.com/file/d/1BVGbve … sp=sharing

Offline