Shop optimieren nach Google PageSpeed Insights

Hallo zusammen, ich würde gerne unseren Shop (testshop auf: sw.eslamica.de) optimieren, gemäß der Vorschläge und Bemängelungen von PageSpeed Insights. Nun habe ich es nach langem hin und her geschafft, dass unser 1und1 Server die meisten Dateitypen gzip-komprimiert ausliefert, und das ohne mod_deflate! :slight_smile: 1. Aber es bleibt Googles folgende Kritik beim Test der URL http://sw.eslamica.de/alle-buecher/verlag-eslamica/ [quote]Durch die Komprimierung von http://sw.eslamica.de/alle-buecher/verlag-eslamica/ könnten 34,1 KB (84 %) eingespart werden.[/quote] Nun ist das allerdings keine Datei, sondern nur eine URL … was genau könnte ich da machen, was kann ich komprimieren um noch diese 34 KB einzusparen? 2. Und laut Google noch wichtiger ist das folgende Problem: [quote]Keine der Seiteninhalte „above the fold“ (ohne Scrollen sichtbar) konnten ohne Wartezeiten für das Laden der folgenden Ressourcen gerendert werden. Versuchen Sie, blockierende Ressourcen zu verschieben oder asynchron zu laden, oder laden Sie kritische Bereiche dieser Ressourcen direkt inline im HTML. Entfernen Sie JavaScript, das das Rendering blockiert: http://sw.eslamica.de/…es/javascript/vendor/modernizr.custom.js[/quote] Ok, stimmt, modernizr.custom.js steht gleich im Header, wie wohl bei allen Shops von Shopware. Was kann man da realistischerweise basteln um diese Verzögerung zu lösen? Ich würde gerne den Shop soweit optimieren, wie es geht. Habe immerhin schon mit einigem Maßnahmen den Shop von den Punktzahlen 62/74 (mobile/desktop) auf jetzt 76/87 gehoben. Aber da geht bestimmt noch mehr. Vielen Dank für eure Tipps zu diesen beiden Fragen! Mustafa

Hallo, modernizr.js sollte auch im Header bleiben. Die restlichen JavaScript-Dateien könnte man von das schließende body-Tag verschieben (müssten Sie aber im Detail austesten). Ladezeit einsparen können Sie zudem durch das gestern uns veröffentliche Plugin “CssJSCompressor” - siehe http://store.shopware.de/sonstiges/cssjscompressor

Das Plugin CssJSCompressor sieht interessant aus, würde es aber gerne erstmal testen bevor ich es kaufe, wäre das möglich?

Der CssJSCompressor ist wirklich interessant. Bin gespannt auf die Tests, die wohl ab kommender Woche möglich sein werden. Vor allem, wenn doch fast alle Server sowieso schon CSS/JS komprimiert ausliefern, dann bin ich gespannt, ob es noch etwas bringt. Aber was ist mit der Komprimierung von nicht-css? Wie gesagt, der folgende Punkte ist offen, kann das jemand nachvollziehen, was damit gemeint ist? [quote]1. Aber es bleibt Googles folgende Kritik beim Test der URL http://sw.eslamica.de/alle-buecher/verlag-eslamica/ [quote]Durch die Komprimierung von http://sw.eslamica.de/alle-buecher/verlag-eslamica/ könnten 34,1 KB (84 %) eingespart werden.[/quote] Nun ist das allerdings keine Datei, sondern nur eine URL … was genau könnte ich da machen, was kann ich komprimieren um noch diese 34 KB einzusparen?[/quote]

Damit gemeint ist imho die HTML komprimierung, wird die gzipped ausgeliefert? Und unnötige Zeilen Umbrüche im Quellcode entfernen. Bei root Zugriff auf den Server geht das ganz praktisch mit mod_pagespeed Gesendet von meinem HTC One mit Tapatalk

Leider sind wir bei 1und1 managed server, und die bieten ja keinen deflate modus an, also haben wir das selbst mit einer Lösung ausm Netz immitiert, wie folgt: In der .htaccess steht: [quote]RewriteRule ^(.*.js) gzip.php?type=js&file=$1 RewriteRule ^(.*.css) gzip.php?type=css&file=$1 RewriteRule ^(.*.html) gzip.php?type=html&file=$1 RewriteRule ^(.*.txt) gzip.php?type=txt&file=$1 RewriteRule ^(.*.xml) gzip.php?type=xml&file=$1 RewriteRule ^(.*.svg) gzip.php?type=svg&file=$1[/quote] Und auf dem Server steht das aufgerufene Skript gzip, welches auch html gzippen sollte. Es wird auch alles korrekt komprimiert ausgeliefert, bis auf diese html, wie Googles PageSpeed meint. Woran kann das liegen? Hier nochmal die PHP “gzip” zur Ansicht: [quote]<?php //check that zlib compression is enabled
if(!ini_get(‘zlib.output_compression’)){ die(); }

$allowed = array(‘css’,‘js’,‘svg’,‘html’,‘txt’,‘xml’); //set array of allowed file types to prevent abuse

//check for request variable existence and that file type is allowed
if(isset(_GET['file']) && isset(_GET[‘type’]) && in_array(substr(_GET['file'],strrpos(_GET[‘file’],’.’)+1), $allowed)){
data = file_get_contents(dirname( __FILE__ ).'/'._GET[‘file’]); // grab the file contents

$etag = '"'.md5($data).'"'; // generate a file Etag
header('Etag: '.$etag); // output the Etag in the header

// output the content-type header for each file type
switch ($_GET['type']) {
	case 'css':
		header ("Content-Type: text/css; charset: UTF-8");
	break;

	case 'js':
		header ("Content-Type: text/javascript; charset: UTF-8");
	break;
	
	case 'svg':
		header ("Content-Type: image/svg+xml; charset: UTF-8");
	break;
	
	case 'html':
		header ("Content-Type: text/html; charset: UTF-8");
	break;
	
	case 'txt':
		header ("Content-Type: text/plain; charset: UTF-8");
	break;
	
	case 'xml':
		header ("Content-Type: text/xml; charset: UTF-8");
	break;
}

header('Cache-Control: max-age=300, must-revalidate'); //output the cache-control header
$offset = 60 * 60;
$expires = 'Expires: ' . gmdate('D, d M Y H:i:s',time() + $offset) . ' GMT'; // set the expires header to be 1 hour in the future
header($expires); // output the expires header

// check the Etag the browser already has for the file and only serve the file if it is different
if ($etag == $_SERVER['HTTP_IF_NONE_MATCH']) {
	header('HTTP/1.1 304 Not Modified');
	header('Content-Length: 0');
} else {
	echo $data;
}

}
?>[/quote] Danke!

hat es denn bereits jemand hinbekommen bei Mobeil und Desktop jeweils 100 Punkte zu erhalten ?

Nein, das bekommt nicht mal Google selbst hin: http://www.shopfluesterer.de/google-pagespeed-insights/

@pemmler - stimmt, selbst eine leere Login Seite von Facebook bekommt keine 100 Punkte :slight_smile:

Siehe PageSpeed Insights

@n8lauscher schrieb:

hat es denn bereits jemand hinbekommen bei Mobeil und Desktop jeweils 100 Punkte zu erhalten ?

Ja ich!   Grin  Bei mir wird bei Beiden 100 Punkte angezeigt, aber kein Vorschaubild.  Die Angaben sind falsch, aber ich weiß nicht warum das so ist.  War nach dem Update auf 5.1.2 auf einmal so.

google selbst schafft das auch nicht:
https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fgoogle.com&tab=mobile

 

Es ist möglich, hatte es bei einer Test Installation vor ein paar Monaten mal gemacht. Aber ist natürlich einiges an Arbeit & fummelei.

Shopwareianer erreicht bspw. 98 Punkte  - Würde ich noch alle Dateien lokal laden, dann wären es auch entsprechend 100. Wobei das unnötig umständlich wäre.

Es ist ein Fehler zu meinen, weil man 100 Punkte hat, würde man automatisch besser bei Google gelistet werden. Totaler unfug. Nehm dir einfach mal einen der best platziertesten Onlineshops wie Zalando, Otto oder auch Amazon. 

Es ist ein Richtwert um seine Seite zu testen. Nicht mehr und nicht weniger. Mit SEO & Google Platzierungen hat es fast nichts zu tun.