Der Vollständigkeit zuliebe hier mal ein ähnliches Plugin für CMSms:

Hab das Plugin mal aktualisiert und mangels Schöpfungshöhe dich als Autor drin gelassen.

https://www.cmsmadesimple.de/forum/view … hp?id=4865

Hoffe, das ist okay für dich ...

Browsertools sind überflüssig und kosten zuviel Zeit.

Eben deshalb halte ich es ja für übertrieben.

Und genau aus dieser Unkenntnis heraus habe ich mich erstmal nur auf den IE beschränkt.

Für übertrieben halte ich das nicht.

Browsertools sind überflüssig und kosten  zuviel Zeit.

Danke

unset($base64_img_location);

soll doch bestimmt

unlink($base64_img_location);

bedeuten.

<?php
#-------------------------------------------------------------------------------
#
# Smarty Plugin : {base64_image}
# Purpose       : This plugin returns a base64 encoded image for embeding in css
# Author        : Georg Busch (NaN)
# Copyright     : 2011 Georg Busch (NaN)
# Version       : 1.0
# License       : GPL
#
#-------------------------------------------------------------------------------

function smarty_cms_function_base64_image($params, &$smarty) 
{
    global $config;
    $img_path = $config['uploads_path'] . DIRECTORY_SEPARATOR . $params['dir'];
    $base64_img = $img_url = $config['uploads_url'] . '/' . $params['dir'];
    
    $ie = false;
    $ie_version = 0;
    $user_agent = isset($_SERVER['HTTP_USER_AGENT']) ? strtolower($_SERVER['HTTP_USER_AGENT']) : false;
    if( stripos($user_agent,'msie') !== false && stripos($user_agent,'opera') === false ) {
        $ie_props = explode(' ',stristr(str_replace(';','; ',$user_agent),'msie'));
        $ie_version = preg_replace('/[^0-9,.,a-z,A-Z-]/','',str_replace(array('(',')',';'),'',$ie_props[1]));
        $ie = true;
    }
    
    $img_formats = array('png','jpg','jpeg','gif');
    $filetype = '';
    $use_mime = (isset($params['use_mime']) && $params['use_mime'] == true);
    if($use_mime)
    {
        if (version_compare(PHP_VERSION, '5.3.0') >= 0 && function_exists('finfo_open'))
        {
            $finfo    = finfo_open(FILEINFO_MIME_TYPE);
            $filetype = strtolower(finfo_file($finfo, $img_path));
            finfo_close($img_path);
        }
        else if(function_exists('mime_content_type'))
        {
            $filetype = strtolower(mime_content_type($img_path));
        }
    }
    else
    {
        $fileinfo = pathinfo($img_path);
        if(isset($fileinfo['extension']))
        {
            $filetype = strtolower($fileinfo['extension']);
        }
    }
    $filetype = str_replace('image/','',$filetype);
    
    if(($ie && $ie_version >= 8) || !$ie )
    {
        $base64_img_location    = $config['previews_path'] . DIRECTORY_SEPARATOR . base64_encode($img_path) . '_' . basename($img_path);
        $base64_img_file_exists = file_exists($base64_img_location);
        $img_file_exists        = file_exists($img_path) && is_file($img_path) && in_array($filetype,$img_formats);
        if($base64_img_file_exists
        && (($img_file_exists && filemtime($base64_img_location) > filemtime($img_path)) || !$img_file_exists)
        && (($ie_version < 9 && filesize($base64_img_location) < 32768) || $ie_version >= 9 || !$ie))
        {
            $base64_img = file_get_contents($base64_img_location);
        }
        else
        {
            @unlink($base64_img_location);
            if(file_exists($img_path) && is_file($img_path) && in_array($filetype,$img_formats))
            {
                $base64_img = 'data:image/'.$filetype.';base64,'.base64_encode(file_get_contents($img_path));
                if($fh = fopen($base64_img_location, 'w'))
                {
                    fwrite($fh,$base64_img);
                    fclose($fh);
                }
                if($ie && $ie_version < 9 && filesize($base64_img_location) > 32768)
                {
                    $base64_img = $img_url;
                }
            }
        }
    }
    echo $base64_img;
}

?>

Verwendung:

<img src="{base64_image dir="Pfad zum Bild" use_mime=true/false}" />

Als Rückgabewert erhält man entweder die URL zum original Bild oder Base64 URI Data.
Mit use_mime kann man festlegen, ob der Dateityp durch den MIME-TYPE oder anhand der Dateiendung erkannt werden soll.
Die Base64 Daten werden im Verzeichnis /tmp/cache/ gespeichert. (Wenn man den Zwischenspeicher löscht, löscht man auch die Base64 Daten).
Die Daten werden nur dann erstellt und gespeichert, wenn sie nicht schon existieren oder wenn das Änderungsdatum des Originalbildes neuer ist als die Base64 Daten.

Die IMG Tags habe ich weggelassen damit man das Script auch in den DB Stylesheets verwenden kann.
Internet Explorer kleiner als Version 8 bekommt generell nur die URL.
Internet Explorer kleiner als Version 9 bekommt nur Base64, wenn die Base64-Datei kleiner ist als 32kB .
Weitere Browser-Überprüfungen habe ich nicht drin.

Edit:

War übrigens eine dumme Idee von mir.
CMSms speichert die Stylesheets ja leider nicht als Templates sondern schon komplett als CSS mit allem drum und dran.
D.h. das base64 Bild ist da schon drin (oder auch nicht, je nachdem wer der erste Besucher war) und dadurch wird das Script nicht nochmal ausgeführt

Naja, muss ich mir meinen eigenen Stylesheet Tag basteln. Oder alle Styles mit ins Template packen. Beim Thema "1 Request" wäre das sowieso besser. Kommt allerdings drauf an wie groß die Bilder/Stylesheets werden.

UDT's sind von Nachteil weil sie aus der DB zu holen wären und wenn ein solcher Vorgang in einer Schleife wiederholt wird steigt die Last ziemlich an.

Da es ein pcms Code ist und memcache unterstützt wird ist da natürlich memcache code enthalten, den muss man für CMSMS entfernen.
Ich arbeite unter pcms mit allen Tricks und Mitteln und da gibt es eine ziemliche Anzahl von Powerusern deren Einsatz förmlich nach memcache schreit.

Memcache führt bei umfangreichen und vor allem reichlich unter Besucherstress stehenden Sites zu einem ordentlichen Boost, kostet aber eine Kleinigkeit.
Memcache wird als Dienst wie Apache oder Mysql selbst ausgeführt und beansprucht Serverram (so gut wie Null PHP Ram) und deswegen wird man es nur im Zusammenhang mit eigenem Server finden.

Auf wenig (durch Besucher)  beanspruchten Websites  ist memcache eher von Nachteil, bringt da wenig bis sogar etwas weniger Power, das dreht sich aber sehr schnell in das Gegenteil um wenn ordentlich etwas los ist auf der Site.

eAccelerator ist dazu da, um PHP Scripte in kompilierter Form im RAM zwischenzuspeichern (shared memory), damit sie nicht erneut vom PHP Parser kompiliert werden müssen.

Ersteres entlastet den Prozess zum Holen der Daten (aus der DB o. woher auch immer).
Letzteres entlastet lediglich beim Ausführen der Scripte.

Beides zusammen klingt für mich nach einem ordentlichen Boost.
(Auch wenn es nach meinem Verständnis mehr RAM benötigen dürfte)

Das ein UDT langsamer ist, hab ich verstanden. Liegt das erigentlich daran, dass ein UDT aus der DB geholt werden muss? Ich habe das als normales Plugin im Plugin-Ordner von CMSMS laufen. Was wäre die beste Methode für die Einbindung solcher Funktionen?

Auch das mit dem Mem_Cache habe ich wohl noch nicht ganz verstanden. Soweit ich informiert bin läuft auf dem Server eAccelerator. Der cached doch Teile der PHP Scripte. Was genau macht der Mem-Cache im Unterschied? Oder kann ich via Mem-Cache auch Daten von z.B. statische Inhalte der Festplatte bereit stellen?

Grüße
Nils

Am einfachsten ist es immer mit webpagetest.org einmal vorher und einmal hinterher zu messen.

Und so läuft's bei mnir:

<?php

#Smarty Function dimage
#PowerCMS (c)2010 by Jan Czarnowski  (czarnowski@powercms.org)
#This project's homepage is: http://powercms.org
#
#This program is free software; you can redistribute it and/or modify
#it under the terms of the GNU General Public License as published by
#the Free Software Foundation; either version 2 of the License, or
#(at your option) any later version.
#
#This program is distributed in the hope that it will be useful,
#but WITHOUT ANY WARRANTY; without even the implied warranty of
#MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
#GNU General Public License for more details.
#You should have received a copy of the GNU General Public License
#along with this program; if not, write to the Free Software
#Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA

function smarty_function_dimage($params, &$smarty) {
    global $goodbrowser, $browser,$config, $memcache,$version;
    $image = isset($params['image']) ? $params['image'] : '';
    $style = isset($params['style']) ? $params['style'] : false;
    $cachetime = 3600;
    if ($image <> '') {
        if ($goodbrowser && !defined('RSS')) {
            $parts = pathinfo($image);
            $image2 = str_replace('../../', '', $image);
            if (isset($parts['extension'])) {
                
                $ext = $parts['extension'];
                $extklein = strtolower($ext);
                $filename = $config['previews_path'] . '/dimage_gd_' . md5($image);
                if (!$memcache) {
                    if (is_file($filename))
                        $data = @file_get_contents($filename);
                    else {
                        $data = base64_encode(file_get_contents($image2));
                        file_put_contents($filename, $data);
                    }
                } else {
                    $data = $memcache->get(md5($filename));
                    if (!$data) {
                        if (is_file($image2))
                            $data = base64_encode(file_get_contents($image2));
                        if ($data)
                            $memcache->set(md5($filename), $data, MEMCACHE_COMPRESSED, $cachetime);
                    }
                }
                if (strlen($data)>32000 && $browser=='msie' && $version < 9.0)
                    $data='';
                if ($extklein == 'jpg') $extklein='jpeg';
                if ($data)
                    echo ' <img src="data:image/' . $extklein . ';base64,' . $data . '" ' . $style . ' />';
                else
                    echo ' <img src="' . $image . '" ' . $style . ' />';
            }
            else
                echo ' <img src="' . $image . '" ' . $style . ' />';
        }
        else {
            if (strpos($config['root_url'], $image) === false) {
                if ($image[0] == '/')
                    echo ' <img src="' . $config['root_url'] . $image . '" ' . $style . ' />';
                else
                    echo ' <img src="' . $config['root_url'] . '/' . $image . '" ' . $style . ' />';
            }
            else
                echo ' <img src="' . $image . '" ' . $style . ' />';
        }
    }
}
?>

Ein UDT ist für solche Sachen übrigens nicht sehr gut geeignet - kann ich nur davon abraten so etwas einzusetzen wenn es um Performance geht.

Kleines Plug-in, dem ich sag, welches Icon ich brauche. Das Plugin bekommt als Parameter mitgegeben, ob der Browser kompatibel ist und gibt einen fertigen IMG-Tag mit Pfadnamen (nicht Kompatibel) oder Bild als data-URI zurück (wenn vorhanden aus Cache sonst erzeugen).

[== smarty ==]

{dataurl}

{foreach from=$file_list->files item='file'}

  {base64_file_icon file_extension=$file->extension compatible=$good_browser}

  {$file->name}

{/foreach}

Beim ersten Aufruf (CMSMS Cache inkl. base64 -> leer) braucht die Installation bei 50 Icons die jeweils einmalig vorkommen zum Ausführen etwa 0.24 Sekunden (Zeit-Angabe von CMSMS). Bei nachfolgenden Aufrufen etwa 0.12 Sekunden. Das Plugin überprüft allerdings auch den Mime-Type des Bildes, was etwas mehr Zeit kostet. Wenn man natürlich weiß, dass es immer image/png ist, oder man den mime-type mitgibt, kann man hier sicherlich noch ein bei Zeit einsparen.

Komplett ohne base64-Plugin liegen die Werte bei etwa 0.13 und 0.12 ...

Der erste Besucher nach dem Leeren des Cache muss zwar 0.11 Sekunden länger warten als ohne Einsatz des Plugins, aber ansonsten kann man den "Performance-Verlust" wohl ruhigen Gewissens als minimal bezeichnen, wenn überhaupt irgendwie relevant vorhanden (habe leichte Schwankungen bei beiden Werten die sich überlagern).

Damit kann ich gut leben

Ohne Plugin ist die Seite 29kb groß, mit 44kb (vorab hatte ich die PNG allerdings nochmal mit PNGOUTWin optimiert). Mit den extra 15kb kann ich ebenfalls gut leben ... das ist wirklich schnuppe ...

In diesem Tesfall habe ich 50 Requests auf der Seite eingesparen und 6 Page-Speed Punkte gewonnen. In Summe also ein sehr gut gelaufen Experiment. Das geht sicherlich noch ein wenig performanter und eleganter, überzeugend find ich's jetzt schon.

Grüße
Nils

Jetzt leuchtet mir ein, dass es wenig Sinn macht, die Icons jeweils am Einsatzort als base64 einzubetten. Dann bette ich das gleiche Icon ja 20 mal ein ... das ist ja auch nicht Ziel der Übung. Oder fällt das bei Komprimierung nicht so ins Gewicht, weil der String identisch ist und geschickt in der Compression "verschwindet" ... kann das jemand beantworten? Dann könnte man quasi "rumsauen".

1. daran denken Images base64 codiert im Cache ablegen, damit man nicht jedes mal bzw. ein Besucher jedes mal die Codierung anwirft.
2. Was die Dateigröße betrifft - Icons haben Micky Maus Format - uninteressant, auch wenn die 50 x eingebunden werden.
3. Sprites - Aufwand groß, Nutzen klein , bei Mengen geht der Schuss wahrscheinlich nach hinten los.

Bei mir gehe ich sogar soweit das ich z.B. Images die von Fremdseite stamme (z.B. Google Wetter) in den Cache ablege und zusätzlich als base64 .

Das Kunststück eines "Gesamtkunstwerks" ist es statt 100% dynamische Generierung zu einer Hybridversion zu werden, in dem sich statische Elemente (Cache) und dynamische die Arbeit teilen.
Das muss vom Ansatz gut überlegt sein, damit es prima funktioniert.

Ich habe meinen Leuten mitgeteilt, das wir mit der nächsten PCMS -Version soweit sind, das wir die Verantwortung über maximale Power den Besuchern überlassen.
Die haben nur dann maximale Power wenn sie mit einem aktuellen guten Browser heran gehen.

Testseiten zeigen den krassen Unterschied - 1 Request bei einem Goodbrowser,  50 Request's beim IE8 und 113 bei dem IE 7 - von Zeiten müssen wir da nicht mehr reden - nichts und niemand kann gegen eine solche Seite anstinken - was die Geschwindigkeit betrifft.
Einfluss nach aussen - Null mit Ausnahme einer Hinweismöglichkeit auf einen Scheiss-Browser.

Die Technik ist seit nun fast 4 Wochen im Dauereinsatz bei einer ziemlich dicken Site die damit reichlich Kohle einsparen - die aufwendigen Kosten für CDN können vollständig entfallen.