Serverless Edge Computing #1: Beschleunigung von High Traffic Landingpages.

Im heutigen E-Commerce geht es nicht ohne eine gute SEO. Google – als Platzhirsch – macht mit vielen Updates der Algorithmen, erklärenden Beiträgen oder auch eigens entwickelten Webtechnologien wie AMP immer wieder klar, wie wichtig die Ladezeiten für eine gute Platzierung sind. 

Wer diese Ladezeiten in der heutigen Zeit außer Acht lässt, wird entsprechend mit schlechten Platzierungen und daraus resultierend mit weniger Traffic und Verkaufschancen bestraft. 

Abseits der SEO Optimierung hat die Geschwindigkeit für jene direkten Besucher aber den gleichen Effekt. Wer als E-Commerce Shop oder Plattform schnell Inhalte liefern kann, hat höhere Chancen auf einen Kauf. 

Mit den Jahren haben sich viele Technologien entwickelt, um Seiten schnell ausliefern zu können. Die Edge Computing Technologie entwickelt sich seit 2 – 3 Jahren zu einer Kerntechnologie. Globale Verkaufsaktivitäten benötigen auch globale Ansätze. 

Caching, also das Zwischenspeichern von Inhalten, in der Cloud gehört heute zum Standard. Anbieter wie Cloudflare bieten einfach zu konfigurierende Lösungen, die für große Teile der Kunden ausreichend sind. Aber: Sie versuchen dabei so wenig Wissen wie möglich vorauszusetzen. Das macht diese Lösungen zwar einfach, aber schöpft deren Potenzial nicht vollständig aus. Wer mehr möchte, muss sich mit Code und komplexeren Technologien wie „Serverless Computing“ auseinandersetzen. 

Wem das noch nichts sagt, findet hier eine sehr gute Erklärung zur Technik: https://www.cloudflare.com/de-de/learning/serverless/what-is-serverless/

Ich möchte euch im Beitrag #1 dieser Reihe zeigen, wie wir diese Technologie, neben einigen anderen, bei unseren Kunden einsetzen, um deren Verkaufschancen durch die Beschleunigung von Seitenaufrufen deutlich zu verbessern. 

Landingpages sind das Foyer.

Gerade im B2C Bereich sind stark frequentierte Landingpages der Eingang zum Shop. Diese werden von organischem Traffic von Google oder von Affiliate Seiten angesprungen. Die Nutzer bekommen eine für ihren, durch die Suche oder vom Affiliate ermittelten Bedarf angepasste Auswahl, und können diese Produkte / Dienstleistungen dann mit einem entsprechend  verkürzten Prozess kaufen. 

Damit das aber gut klappt, muss die Seite schnell laden, responsive, aktuell und vom Inhalt passend sein. In diesem Beitrag schauen wir uns besonders den Aspekt „schnell laden“ an.

Was dauert da so lang auf dem Server?

Wenn wir einen Seitenaufruf betrachten, können wir den inhaltlich in zwei Bereiche aufteilen:

1. Statische Inhalte (Assets) wie Bilder, Scriptdateien und Stylesheets (wie bspw. CSS)
2. Dynamische Inhalte, wie das HTML. Dieses enthält in der Regel Produktdaten und Inhalte, die aus einer oder mehreren Datenbanken geladen werden. Das HTML kann sich auch für jeden Nutzer unterscheiden. Beispielsweise, wenn die Seite einen Warenkorbinhalt anzeigt, den der Besucher bereits zuvor erzeugt hat. Oder, wenn der Besucher noch eingeloggt ist, die Begrüßung mit seinem Namen. 

Für statische Inhalte verwenden wir bereits seit Jahren den CDN Anbieter Cloudflare mit Funktionen wie Mirage, Rocket Loader und eben dem Zwischenspeichern statischer Inhalte wie den Bildern der Seite. Diese werden dann möglichst nah vom Standort des Besuchers von einem Cloudflare Datencenter ausgeliefert und sind damit entsprechend schneller beim Nutzer. 

Dynamische Inhalte werden vom Server generiert und das benötigt mehr Zeit. Je mehr Produkte und Preisberechnungen auf der Seite nötig sind, desto länger dauert die Berechnung des HTML. Und das passiert bei jedem Aufruf neu.

Diese Zeit möchten wir verkürzen und damit die Time To First Byte, also die Zeit, bis der Browser des Besuchers den HTML-Code zur Verfügung gestellt bekommt, stark verkürzen. Verkürzt man diese Zeit, können alle folgenden Inhalte wie Bilder und Videos ebenfalls deutlich schneller geladen werden und der Besucher sieht viel früher ein Ergebnis.  


Cloudflare Worker machen das möglich.

Kommen wir zum Kern der Sache. Landingpages haben in der Regel keinen oder nur wenig besucherspezifischen Inhalt. Sie müssen zudem extrem schnell ausgeliefert werden, um die Chancen zu erhöhen. 

Hier setzen wir auf Serverless Computing über die Cloudflare Worker Plattform. Die ermöglicht es uns, beim Aufruf einer Landingpage, den HTML Inhalt aus dem Cloudflare Cache zu laden. Dabei wird der Server unseres Kunden nicht mehr direkt, sondern nur vom Worker besucht, während der Worker bereits eine zwischengespeicherte Version des HTML an den Besucher ausliefert. 

Der Besucher hat seine Seite längst erhalten und im Hintergrund prüft der Worker, ob sich an der Originalseite vom Server unserer Kunden Änderungen befinden und speichert diese im Anschluss für den nächsten Kunden zwischen. 

Das resultiert in erheblich schnelleren Ladezeiten. Eine Verbesserung um Faktor 5 zum Original ist normal. Bei aufwändigen Seiten mit vielen Produkten geht noch deutlich mehr. 

Ohne Cloudflare Worker:

Mit Cloudflare Worker:

Dabei gestalten wir unsere Worker so, dass sie auf die besonderen Bedingungen unserer Kunden und deren Geschäft Rücksicht nehmen.

Bei Aufrufen von Affiliate, also Vermittlerseiten, enthalten die Links oft URL Parameter, die es ermöglichen, einen aus dem Besuch resultierenden Kauf später auch für den Affiliate mit einer Auszahlung zu belohnen. Der Worker stellt sicher, dass entsprechende Parameter weiterhin gespeichert werden und damit eine passende Auszahlung gewährleistet ist. Hierfür muss aber nicht mehr jede Seite mit unterschiedlichen URL Parametern im Cloudflare Cache zwischengespeichert werden. 

Durch die Serverless Architektur passiert diese Verarbeitung so nah beim Besucher wie möglich und spart entsprechend Latenzzeit. Auch ist keine gesonderte Wartung für Hardware etc. notwendig, da diese ja nicht mehr benötigt wird.

Diese Lösung ist für alle Landingpages unserer Kunden skalierbar und ohne manuelle Eingriffe nutzbar. Auch müssen unsere Kunden keine Rücksicht auf die Cloudflare Worker bei der Erstellung ihrer Landingpages nehmen. Sie funktionieren vom ersten Aufruf der Seite.

There is more to come...

In dieser Reihe werden von vielen Beispielen von Serverless Edge Computing folgen. Gerade im Bereich der SEO, Performanceverbesserung und der API Anbindung werden wir euch noch einige Beispiele zeigen. 

Wir zeigen aber nicht alles. Wer tiefe Einblicke haben möchte oder sich beteiligen möchte an unseren Projekten, schaut sich gerne mal unsere offenen Stellen an. Wir freuen uns immer über motivierte Menschen, die Lust haben, die Zukunft des E-Commerce für unsere Kunden mitzugestalten und voranzubringen. 

https://www.complex-it.de/jobs/