Startseite mit 5 MB! Unsinnige Größe der Thumbnails

Hallo,

ich greife das Thema nochmal auf. Wie vorher beschrieben, habe ich im Ordner Einkaufswelt die Thumbnails von 90 auf 70 % reduziert und neu generiert. Inzwischen sind Tage vergangen x-mal der Cache und Browsercache geleert. Google pagespeed sieht bei den 800er TN immer noch die gleiche Größe.

Wurden die “alten” da evtl nicht überschrieben? Habe des öfteren gelesen, dass da irgendwas nicht sauber gelöscht wird oder so…

Meine Zwischenlösung, so lange sich das Thumbnailgrößenproblem nicht geklärt hat:

Bei der Desktop-EKW die Banner weitestgehen rausnehmen, da hier die 800er TN bemängelt werden. Statt dessen mehr Produktstreams - die scheinen kein Problem zu sein.

Bei der Mobil-EKW die Produktstreams rausnehmen, denn da werden die 1280er TN bemängelt. Statt dessen mehr EKW-Banner, dort sind die wohl unproblematisch.

Nicht optimal, da gerade die Mobile-EKW wichtig ist.

LG

Hi zusammen,

zwar schon ein etwas älterer Thread, aber ich habe damals einfach im box-emotion.tpl innerhalb vom picture Tag das zweite if $srcSet auskommentiert. Hat in der mobilen Version nochmal 5 Punkte im Pagespeed gebracht und ansonsten die Standardbilder ausgeliefert, was sowohl in der Desktopansicht als auch in der mobilen Ansicht vollkommen genügt.

Ich weiß, schön ist es nicht und hoffentlich kommt hier bald das gewünschte Update…

@coarsy schrieb:

Hi zusammen,

zwar schon ein etwas älterer Thread, aber ich habe damals einfach im box-emotion.tpl innerhalb vom picture Tag das zweite if $srcSet auskommentiert. Hat in der mobilen Version nochmal 5 Punkte im Pagespeed gebracht und ansonsten die Standardbilder ausgeliefert, was sowohl in der Desktopansicht als auch in der mobilen Ansicht vollkommen genügt.

Ich weiß, schön ist es nicht und hoffentlich kommt hier bald das gewünschte Update…

evtl. könnte man stattdessen auf die Generierung der Retina-Thumbnails verzichten 

Hi NextMike,

das habe ich ohnehin schon getan, allerdings ist es immer noch seltsam, dass in der mobilen Einkaufswelt in einem 4 er Raster die großen Produktbilder heranzogen werden und nicht die standardmäßigen mit 200 x 250, wenn man den von mir beschriebenen Part nicht auskommentiert.

1 „Gefällt mir“

Es gibt noch einen weiteren Thread dazu. Aus irgendeinem Grund werden teilweise die falschen Thumbnails herangezogen. SW hatte sich dazu auch geäußert, bat um nähere Infos. (Zumindest ich habe die per PN übermittelt) Aber seither hört man da auch nichts…

Da ist der Link

Hi nochmal,

ich tüftel das die Tage nochmal aus und dann finde ich bestimmt eine Lösung, wie anstatt der 600 er Bilder in der mobilen Ansicht die 200 er gezogen werden.
Ich schätze, dass das Shopware in einem der nächsten großen Releases entsprechend modifiziert hat.

Ansonsten hilft natürlich wirklich das Auskommentieren des Tags im box-emotion.tpl.



LG,

Chris

Ich verstehe nicht, warum die Thumbnailfunktion in Shopware Originalbilder vergrößert (nicht nur die Dateigröße, die Abmessungen werden auch skaliert). Das bewirkt doch keinerlei Qualitätsverbesserung. Die sollen die Originaldaten ausliefern und den Browser skalieren lassen!

@pierre-schmitz schrieb:

Ich verstehe nicht, warum die Thumbnailfunktion in Shopware Originalbilder vergrößert (nicht nur die Dateigröße, die Abmessungen werden auch skaliert). Das bewirkt doch keinerlei Qualitätsverbesserung. Die sollen die Originaldaten ausliefern und den Browser skalieren lassen!

tut sie das? 

Die nimmt doch nur die hochgeladenen Dateien und generiert die im Media Manager vorgegebenen Größen. Dann sollte anhand des Sourcesets je nach Device die korrekte Größe ausgeliefert werden, was aber nicht funktioniert, da in einer EK-Welt immer nur das 600 er bei einem 4 er Raster selektiert wird…

Habe gestern noch ewigst mit den verschiedenen Möglichkeiten der Resourcesets und der Sizes rumgespielt, aber ich habs nicht hinbekommen, dass das lleine Bild auch beim mobilen Device genommen wird. Eigentlich benötigt man ja nur für dieses Raster die kleinen Bilder und sogar fürs mobile Device noch kleinere Bilder. Sollten da nicht 2 verschiedene Auflösungen Genüge tun?

Hat das mal jemand im issue tracker bei Shopware hinterlegt?

@rolfs weiß ich nicht, es gibt schon so viele offene Posts zu diesem Thema, ich hab den Übeblick verloren…

@coarsy‍ Da ich mich mit den TN überhaupt nicht auskenne und nicht weiß, ob es hier einen Zusammenhang geben kann, das Folgende nur mal zur Info:

Um die URLs aller Produktbilder und TN schnell in einer Übersicht zu haben, habe ich mir eine Exportdatei angelegt. (Ich verwende die TN wie von SW voreingestellt.) Die Ausgabe dieser URLs klappt bei dem ersten Artikelbild fehlerfrei. Ab dem 2. Bild steht in der Spalte 200x200 die 600er TN und in der Spalte für die 600er ebenfalls die 600er. D.h. Ab dem 2. Bild wird die URL der 200x200 nicht ausgegeben.

Meine Kopfzeile:

{strip}
url{#S#}
kategorie{#S#}
title{#S#}
beschreibung{#S#}
preis{#S#}
artid{#S#}
image_original{#S#}
image0 200{#S#}
image1 600{#S#}
image2 1280{#S#}
bild2 original{#S#}
bild2 200{#S#}
bild2 600{#S#}
bild2 1280{#S#}
Bild3 original{#S#}
bild3 200{#S#}
bild3 600{#S#}
bild3 1280{#S#}
bild4 600{#S#}
{/strip}{#L#}

Template:

{strip}
{$sArticle.articleID|link:$sArticle.name|escape}{#S#}
{$sArticle.articleID|category:">"}{#S#}
{$sArticle.name|escape|truncate:70}{#S#}
{$sArticle.description_long|strip_tags|strip|trim|truncate:150:"…":true|html_entity_decode|escape}{#S#}
{$sArticle.price|escape:“number”}{#S#}
{$sArticle.ordernumber}{#S#}
{$sArticle.image|image|escape}{#S#}
{$sArticle.image|image:0|escape}{#S#}
{$sArticle.image|image:1|escape}{#S#}
{$sArticle.image|image:2|escape}{#S#}
{assign var=“string” value=$sArticle.articleID|articleImages:$sArticle.ordernumber:0:">"|escape}
{assign var=“productVariantImage” value=">"|explode:$string}{$productVariantImage[1]}{#S#}
{assign var=“string” value=$sArticle.articleID|articleImages:$sArticle.ordernumber:3:">"|escape}
{assign var=“productVariantImage” value=">"|explode:$string}{$productVariantImage[1]}{#S#}
{assign var=“string” value=$sArticle.articleID|articleImages:$sArticle.ordernumber:1:">"|escape}
{assign var=“productVariantImage” value=">"|explode:$string}{$productVariantImage[1]}{#S#}
{assign var=“string” value=$sArticle.articleID|articleImages:$sArticle.ordernumber:2:">"|escape}
{assign var=“productVariantImage” value=">"|explode:$string}{$productVariantImage[1]}{#S#}
{assign var=“string” value=$sArticle.articleID|articleImages:$sArticle.ordernumber:0:">"|escape}
{assign var=“productVariantImage” value=">"|explode:$string}{$productVariantImage[2]}{#S#}
{assign var=“string” value=$sArticle.articleID|articleImages:$sArticle.ordernumber:1:">"|escape}
{assign var=“productVariantImage” value=">"|explode:$string}{$productVariantImage[2]}{#S#}
{assign var=“string” value=$sArticle.articleID|articleImages:$sArticle.ordernumber:1:">"|escape}
{assign var=“productVariantImage” value=">"|explode:$string}{$productVariantImage[2]}{#S#}
{assign var=“string” value=$sArticle.articleID|articleImages:$sArticle.ordernumber:2:">"|escape}
{assign var=“productVariantImage” value=">"|explode:$string}{$productVariantImage[2]}{#S#}
{assign var=“string” value=$sArticle.articleID|articleImages:$sArticle.ordernumber:1:">"|escape}
{assign var=“productVariantImage” value=">"|explode:$string}{$productVariantImage[3]}{#S#}
{/strip}{#L#}

 

Sofern ich im Template keinen Fehler habe, wird aus irgendeinem Grund die 200er nicht abgerufen. Was vlt die gleiche Ursache hat, wie der falsche Abruf im o.g. Thema? Allerdings wid in der EKW ja das erste Produktbild angezeigt und dort wird bei mir in der Datei auch die 200er ausgegben.

 

Nein, im Sourceset des Picturetags wird die 200 er klar definiert und der Pfad dorthin passt wirklich. Allerdings scheint der Media Query nicht korrekt zu funktionieren.

1 „Gefällt mir“

Wenn dazu ein Ticket angelegt wird, vote ich :slight_smile:

Das Problem dabei ist doch aber, dass man hier überhaupt kein Sourceset benötigt, bzw. man eigentlich für die mobile Ansicht was Kleineres als 200 brauchen würde. 600 in der Desktop Version sind auch noch zu breit… Die Bildgrößen müssten gleichzeitig abhängig von der Spaltenanzahl und der Größe des Viewports geswitcht werden. Vielleicht sollte man die Bildgröße pro Einkaufswelt und Device definieren können.

Hat das auch was mit zu tun?

 

Danke und Gruß

Das Problem haben wir auch.

Bei Einkaufswelten (Artikel-Slider) für Mobile werden größere Thumbnails genommen: ID=2 --> 1280x1280

Und für Desktop kleinere 200x200

kann sein dass das ein Bug ist in:  frontend/listing/product-box/box-emotion.tpl

200x200 - Mobile
600x600 - Tablet
1280x1280 - Desktop

Artikel-Slider:

/templates/default/widgets/emotion/components/slide_articles.tpl

die entsprechende Stelle dann:

{assign var=image value=$article.image.src.4}

$article.image.src.? 

Welche SW-Version? Mit dem letzten Update gab es eine Änderung. Evtl. wäre es damit behoben oder zumindest besser.

Was gab es denn für eine Änderung ?

Na, die Änderung der dynamischen Auslieferung von Thumbnails. Ist in der aktuellesten SW Version *.22 enthalten. Bei mir hats jedenfalls einiges gebracht.