Neuigkeiten
  • Die modified eCommerce Shopsoftware ist kostenlos, aber nicht umsonst.
    Spenden
  • Damit wir die modified eCommerce Shopsoftware auch zukünftig kostenlos anbieten können:
    Spenden
  • Thema: modified eCommerce Shopsoftware optimieren

    Phil333

    • Mitglied
    • Beiträge: 166
    modified eCommerce Shopsoftware optimieren
    am: 02. April 2012, 16:09:44
    Hallo an alle!

    Ich versucher gerade meinen shop zu optimieren und habe dabei schon ein paar KB an Datengröße gut gemacht.

    Zur Unterstützung teste ich das Ganze mit Page Speed und YSlow.
    Das seltsamste gleich zu Beginn: Bei Page Speed habe ich einen Score von 77 - damit bin ich natürlich nicht sehr zufrieden.
    Wenn ich die Seite neu lade kommt es allerdings auch schon vor, das der Wert auf 44 runter rutscht und ich die Meldungen bekomme "Keep-Alive aktivieren".
    Ich dachte das hätte mit der generellen "Lebensdauer" von Dateien wie .css, .jpg etc zu tun und habe daher in der .htaccess ein bisschen was nachgerüstet:

    Code: PHP  [Auswählen]
    <IfModule mod_expires.c>
      ExpiresActive on

    # Perhaps better to whitelist expires rules? Perhaps.
     ExpiresDefault                          "access plus 1 month"

    # cache.appcache needs re-requests in FF 3.6 (thanks Remy ~Introducing HTML5)
     ExpiresByType text/cache-manifest       "access plus 0 seconds"
     
    ## usw[......]

      <IfModule mod_headers.c>
        Header append Cache-Control "public"
      </IfModule>
     
    </IfModule>

    wie kann ich diese Schwankungen umgehen?

    Außerdem wird mir immer gesagt, das ich meine Bilder in CSS Spites anlegen soll.
    Eine entsprechende Grafik hab ich schon erstellt, nur weiß ich nicht, wie ich die wirklich einbinde.
    Die Bilder sollen nur für das Layout dienen - vor allem boxheader und bg_ Bilder.
    Weiß jemand, wie man das konkret integrieren kann oder eventuell auch per "maps" oder so?

    YSlow dagegen muckiert bei "entity tags" und "cookie-free domains" - bei denen ich jeweils nicht weiß, was ich daran ändern kann. Die tags werden ja dynamisch eingelesen.
    Gibts dazu schon irgendwas um das rating dahingehend zu verbessern?

    Linkback: https://www.modified-shop.org/forum/index.php?topic=19271.0
    Trade Republic - Provisionsfrei Aktien handeln

    cayuco

    • Fördermitglied
    • Beiträge: 847
    • Geschlecht:
    Re: modified eCommerce Shopsoftware optimieren
    Antwort #1 am: 02. April 2012, 17:40:01
    Hallo, schau mal hier: http://www.greywyvern.com/code/php/binary2base64 - da kann man Grafiken in base64 umwandeln un d dann wie eine Grafik in die Styles einbinden.

    Matt

    • Experte
    • Beiträge: 4.241
    Re: modified eCommerce Shopsoftware optimieren
    Antwort #2 am: 02. April 2012, 18:15:34
    Das seltsamste gleich zu Beginn: Bei Page Speed habe ich einen Score von 77 - damit bin ich natürlich nicht sehr zufrieden.
    Wenn ich die Seite neu lade kommt es allerdings auch schon vor, das der Wert auf 44 runter rutscht und ich die Meldungen bekomme "Keep-Alive aktivieren".
    Ich dachte das hätte mit der generellen "Lebensdauer" von Dateien wie .css, .jpg etc zu tun und habe daher in der .htaccess ein bisschen was nachgerüstet:

    Nein, Keep-Alive hat damit nichts zu tun. Es beschreibt vielmehr ein Verhalten des Webservers, die Verbindung nicht sofort zu beenden, sondern mehrere Dateien über ein und die selber Verbindung zu schicken. Dadurch wird Wartezeit eingespart, die sonst durch das Negieren der Verbindung und das Übertragen von nur für die Verbindung selbst notwendigen Informationen verloren geht.
    Bei diversen SharedHosting-Angeboten ist es nicht möglich, KeepAlive zu aktivieren.

    wie kann ich diese Schwankungen umgehen?

    Indem du KeepAlive aktivierst.

    Zitat
    Außerdem wird mir immer gesagt, das ich meine Bilder in CSS Spites anlegen soll.
    Eine entsprechende Grafik hab ich schon erstellt, nur weiß ich nicht, wie ich die wirklich einbinde.
    Die Bilder sollen nur für das Layout dienen - vor allem boxheader und bg_ Bilder.
    Weiß jemand, wie man das konkret integrieren kann oder eventuell auch per "maps" oder so?

    Diese Technik kann ausschließlich für Hintergrundbilder angewendet werden, die im CSS sind. Und je nachdem, wie diese kacheln, auch nicht immer.
    http://bueltge.de/css-sprites-einfach-erklaert/675/ bietet eine grundlegende Einführung zu dem Thema. http://de.spritegen.website-performance.org/ bietet die Möglichkeit, sich ein entsprechendes Sprite erzeugen zu lassen und man bekommt auch gleich die passenden x/y-Koordinaten mitgeliefert. Das von dort generierte Bild sollte man aber auf jeden Fall noch einmal durch einen Bildoptimierer wie ImageOptim jagen.

    YSlow dagegen muckiert bei "entity tags" und "cookie-free domains" - bei denen ich jeweils nicht weiß, was ich daran ändern kann. Die tags werden ja dynamisch eingelesen.

    YSlow moniert vermultich ETags.
    FileETag Nonehilft.
    Cookie-Free Domains ist etwas komplexer und funktioniert eher nur mit eigenem Server oder Zugriff auf die Apache-Konfiguration und lässt sich nicht wirklich in drei Worten erklären. Mach ich aber demnächst mal.

    Gibts dazu schon irgendwas um das rating dahingehend zu verbessern?

    http://50north.de/category/its-all-about-speed/

    da kann man Grafiken in base64 umwandeln un d dann wie eine Grafik in die Styles einbinden.

    Dadurch werden sie aber nicht automatisch zum Sprite.

    Phil333

    • Mitglied
    • Beiträge: 166
    Re: modified eCommerce Shopsoftware optimieren
    Antwort #3 am: 02. April 2012, 20:04:06
    Hmmm

    das ist aber dann seltsam, das KeepAlive mal als Hinweis gegeben wird und mal nicht.

    Wo muss man denn das
    Zitat
    FileETag None
    einbauen, damit es funktioniert?

    Bei den CSS Spites habe ich ja schon ein solches, optimiertes und komprimiertes Bild - auch mit Koordinaten.
    Ich verstehe nur nicht, wie ich es einbinden kann.
    Wie macht man das denn z.B. bei den "boxheader" ?
    diese haben ja schon klassen etc. - nur leider weiß ich nicht wie ich das umstellen kann

    twe

    • Schreiberling
    • Beiträge: 293
    • Geschlecht:
    Re: modified eCommerce Shopsoftware optimieren
    Antwort #4 am: 02. April 2012, 20:18:33
    Wieso behebst du nicht erst die anderen Sachen, bevor du mit CSS-Sprites. Ich bin ohne die Sprites auf 96 v 100 gekommen. Sind nur noch Kleinigkeiten zum optimieren übrig.

    Phil333

    • Mitglied
    • Beiträge: 166
    Re: modified eCommerce Shopsoftware optimieren
    Antwort #5 am: 02. April 2012, 23:00:28
    bei Speed Page ist es außer den KeepAlive noch CSS Spites und dann "JavaScript später parsen".
    Außer dem ist die Seite weitestgehend (für Speed Page) optimiert.
    Nur weiß ich nicht, wie ich diese 3 Punkte optimieren kann. (wobei das KeepAlive seltsam ist, das es mal gemeldet wird und mal nicht)

    Bei YSlow ist es entity tags, cookie-free domains, CDNs und wieder
    Code: PHP  [Auswählen]
    Make fewer HTTP requests
    This page has 4 external Javascript scripts. Try combining them into one.
    This page has 3 external stylesheets. Try combining them into one.
    This page has 10 external background images. Try combining them with CSS sprites.
     

    was es sonst zu optimieren gab habe ich bereits und komme nun leider nicht weiter

    Matt

    • Experte
    • Beiträge: 4.241
    Re: modified eCommerce Shopsoftware optimieren
    Antwort #6 am: 03. April 2012, 07:15:20
    Nur weiß ich nicht, wie ich diese 3 Punkte optimieren kann. (wobei das KeepAlive seltsam ist, das es mal gemeldet wird und mal nicht)

    Nein, das ist normal. Ich habe mich im Detail nicht damit beschäftigt und weiß daher auch nicht, wie die Tools das genau ermitteln, die Erkennung ist aber durchaus nicht 100% zuverlässig, wenn aber keines erkannt wird gibt es auch keines.

    Bei YSlow ist es entity tags, cookie-free domains, CDNs und wieder

    Du meinst vermutlich wieder ETags. Das entsprechende Stück Code muss in die .htaccess oder die Apache-Config.

    Code: PHP  [Auswählen]
    This page has 4 external Javascript scripts. Try combining them into one.

    http://code.google.com/p/minify/

    Code: PHP  [Auswählen]
    This page has 3 external stylesheets. Try combining them into one.

    http://code.google.com/p/minify/

    Code: PHP  [Auswählen]
    This page has 10 external background images. Try combining them with CSS sprites.

    Das scheint mir ja bei dir am generellen Verständnis von CSS zu scheitern. Little Boxes lesen hilft.