Ladezeiten mit Amazon Pay

Die Performance eines Shops ist mitunter ein wichtiges Kriterium für die Abschlussrate eines Kaufes. Auch Suchmaschinen wie Google bewerten die Geschwindigkeit mit der Webseiten ausgeliefert werden. Als eines der wichtigen Tools ist hier PageSpeed Insights von Google zu nennen. Aber auch die Console des Browser liefert aufschluss darüber, wie schnell Ihre Seite ausgeliefert wurde und im Detail sogar, welche Dateien hier als "Bremse" in Frage kommen.

Im Support kommen des öfteren Anfragen an, ob und wie weit die Einbindung von Amazon Pay, diesen Pagespeed beeinflusst. Um Ihnen hier einmal dazu genauere Auskunft erteilen zu können möchten wir Sie zächst mit einigen Faktoren bekant machen.

Die Geschwindigkeit setzt sich zusammen aus:

Das ist vereinfacht dargestellt. Natürlich erhöhen Sie mit jedem Plugin das Sie einrichten das Volumen von zu übertragenen Daten. Bei unserem Amazon Pay Plugin ist es so, dass durch das Plugin zunächst die Funktionalität des Payments integriert wird. Es greift auf das SDK zurück, das im Plugin mitgebracht wird. Innerhalb dieses SDK müssen weitere Ressourcen direkt von Amazon geladen und eingebunden werden.

Im Normalfall laden Sie mit Amazon Pay ca. 3-6 Ressoucen nach. Im Regelfall kommen dabei ca. 100-130 kb Volumen zusammen.

Testing

Wir haben bei der Weiterentwicklung stets ein Auge darauf, bei einem stets wachsenen Angebot an Funktionen, eine möglichst Performante Leistung des Plugins zu bewirken. Sollten sich in Ihrer Integration gravierende Abweichungen darstellen, so können Sie uns mit konkreten Details gerne unter support@bestit.de zur Beratung heranziehen. Wir müssten diese Analyse auf Ihrem Shopsystem nachvollziehen können um das Gesamtbild zu beurteilen.

In unserem Test haben wir uns auf die üblichen Seiten eines Shopbesuchers fokussiert:

Wir testen einmal den "Auslieferungszustand" des Plugins. Dabei sind zunächst alle möglichen Einbindungen des Amazon Pay Buttons an den vorgesehenden Stellen aktiviert und auch das Logo der Sidebar aktiv.

Möchten Sie Ihren Shop selbst testen, dann empfehlen wir Ihnen das kostenlose Performance Tool commerce-score.io. Dort können Sie vorher/nacher Vergleiche und Optimierungspotential für die getesteten Seiten entdecken. Vergleichen Sie die Zahlen zwischen verschiedenen Ständen Ihres Shops.

Button Konfiguration Auslieferungszustand

Im Plugin finden Sie folgende Optionen, einen Amazon Pay Button einzubinden:

Im Auslieferungszustand ist jeder der Buttons unter der Variante "Langinfo (Gold - Mittel)" voreingestellt. Amazon stellt aus Gründen der Corporate Identity die Buttons ausschließlich in Echtzeit (externer Download) zur Verfügung.

Sie können die Varianten nach Bedarf wie angeboten ändern. Nur auf der Warenkorbseite, kann man Ihnen die Option "nicht anzeigen" - nicht anbieten.

Button Varianten

Eine detaillierte Liste der Buttons und deren aktuellen Erscheinungsbild finden Sie direkt auf den Seiten von Amazon Pay: https://developer.amazon.com/de/docs/amazon-pay-onetime/button-widgets.html

Es gibt einen Login (LwA = Login with Amazon) und einen Payment (PwA = Pay with Amazon) Button, in Gold, hell und dunkel Grau. Alle Buttons werden in vier Größen angeboten.

Anhand der Optionen können Sie also selbst im gewissen Rahmen bestimmen - wo und damit wie viel Ressourcen von Amazon geladen werden sollen. Das Frontend von Shopware und insbesondere die Cache Logik verlangt jedoch von uns, dass wir bestimmte Komponenten konstant laden müssen, auch wenn der Button unter Umständen gar nicht an einer Bestimmten stelle eingeblendet wird.

Messwerte

Im nun nachfolgenden Überblick unserer Messungen haben wir die Ladezeiten in der Chrome Development Console ausgewertet. Dabei ist der Auslieferungszustand der Konfiguration genutzt worden. Einmal haben wir Amazon Pay aktiviert und einmal deaktiviert um die Messungen transparent zu vergleichen. Je Seite haben wir 10 Ladevorgänge vorgenommen und den Mittelwert daraus gebildet. Im Test (01.2020) haben wir auf Version 9.4.1 des Plugins zurückgegriffen und einer Standard Shopware Out-of-the-Box Version mit Standard Responsive Theme.

Die Ergebnisse im Vergleich

Page mit/ohne Finish (s) DOM Content (s) Load (s)
/startseite 3,48 3,73 1,27 1,23 2,59 2,56
/account 2,82 2,45 1,45 1,40 2,78 2,41
/kategorie 3,78 3,28 2,11 2,00 3,81 3,22
/detail 3,95 3,11 1,56 1,59 3,17 2,80
/checkout Login 2,33 1,99 1,06 1,03 2,26 1,95
/adress widget*¹ 3,53 1,35 3,41
/wallet widget*¹ 3,32 1,17 3,19
/checkout/confirm*¹ 5,29 1,96 3,17
SCA & Finish Page*² 4,48 2,02 2,97 0,98 4,02 1,94

*¹ Diese Seite gibt es nur durch den Amazon Prozess und ist nicht vergelichbar "ohne"

*² Diese Seite beinhaltet den SCA Prozess und den Aufbau der Finish Seite mit finaler Verarbeitung des erfolgreichen Checkouts

Resumee: Sie sehen natürlich das die externe Abwicklung eines Payments Perfomance benötigt und insbesondere zum Abschluss hin sehr viele Daten verarbeitet werden müssen. Aber in der Bewertung eines Google PageSpeed Insight kommt der Checkout selbst nicht in Betracht und damit beeinflusst dies auch nicht die Bewerungsskala Ihres Webshops.

Wir hoffen mit dieser real getroffenen Auswertung Ihnen ein Bild aus unserer Sicht zur Frage Perfomance geben zu können. Es gibt durchaus Möglichkeiten noch mehr Performance zu generieren - jedoch lässt sich im Rahmen mit Amazon Pay und der Einbindung externer Ressourcen und im Bezug auf das Frontend Cachen nur begrenzt etwas umsetzen.