Start E-Commerce ISR vs DPR: Ansätze zum Gestalten einer schnelleren Website

ISR vs DPR: Ansätze zum Gestalten einer schnelleren Website

0
ISR vs DPR: Ansätze zum Gestalten einer schnelleren Website

ISR, DPR – was soll das sein?

ISR ,,Incremental Static Regeneration” und DPR ,,distributed persistent rendering” sind zwei Ansätze zur Gestaltung von Websites. Sie eignen sich besonders für größere Websites, die auf Browser abgestimmt sind, aber wegen ihrer Datenmenge längere Ladezeiten erfordern. Um der Website schnellere Ladezeiten zu ermöglichen, wird beispielsweise das Rendern und Laden einzelner Webseiten und Unterseiten ,,verschoben“. Wichtige Teile der eigenen Website, beispielsweise die Homepage oder die Kontaktseite, werden nach wie vor beim Aufrufen der Website sofort aufgebaut und geladen. Weniger wichtige Unterseiten aber, wie etwa ein Produktkatalog, werden allerdings erst aufgebaut sobald sie vom User angefragt werden. Besonders wenn besagte Unterseiten (Blogs, Kataloge) Informationen enthalten, die regelmäßig aktualisiert werden, stauen sich Datenmengen an, die lange Ladezeiten benötigen. In dieser Hinsicht sind die beiden vorgestellten Ansätze (ISR; DPR) sehr effektiv. Durch diese kann sich die Website beim Laden schneller aufbauen und benötigt weniger Zeit, um komplett sichtbar zu sein. In Anbetracht der neuen Google Core  Web Vitals ist dies umso wichtiger, weshalb die beiden vorgestellten Ansätze umso wichtiger sind.

ISR ,,Incremental Static Regeneration” Website ISR DPR coding

Genau wie DPR ist ISR ein Ansatz, der das Laden und Aufbauen einer Website in ein Stufenmodell verwandelt. Wichtige Unterseiten (z.B. Homepages) werden sofort gerendert und aufgebaut, Unterseiten mit viel Inhalt und Datenmenge, besonders wenn diese keine feste Größe hat, werden erst nach Abruf präsentiert. Für Online-shops beispielsweise ist dies sehr praktisch, der Kunden kann sich die Produktpalette ansehen ohne sich um längere Ladezeiten sorgen zu müssen. ISR bewerkstelligt dies, indem es beim ersten Abruf der entsprechenden Webseite sehr viele Platzhalter für den relevanten Inhalt generiert, während der tatsächliche Inhalt vorgerendert wird. Erst wenn ein Nutzer diesen abruft, indem er weiter scrollt zum Beispiel, baut sich dieser direkt auf. Zudem kann sich der Nutzer auf der Webseite frei bewegen, während sich die einzelnen Elemente stets neu aufbauen und aktualisieren, ohne dass ein Aktualisierung der Webseite durch den Nutzer von Nöten wäre. Eine kleine Anleitung und Herangehensweise zu ISR finden sie hier.

DPR ,,distributed persistent rendering“

Websites, die DPR für ihre Unterseiten benutzen, verlagern ähnlich wie bei ISR den Prozess des Renderns auf den Moment, in dem der Nutzer diese Unterseiten abruft. Bei DPR allerdings sind die abgerufenen Inhalte statisch. Der Nutzer kann direkt nach Abruf auf eine aufgebaute Webseite samt sämtlicher Inhalte zugreifen und ist direkt auf dem neuesten Stand, da die neuesten Infos und Änderungen beim Aufruf mit aufgebaut wurden. Sollten Sie zum diesem Ansatz mehr erfahren wollen, so empfehlen wir Ihnen, sich hier zu informieren.

ISR oder DPR?

Beide hier präsentierten Ansätze erweisen sich als sehr praktisch für Websites, die nicht nur viel Inhalt bieten, sondern deren Inhalt auch ständig aktualisiert wird. Darunter fallen z.B. neue Einträge, Produkte oder angepasste Preise. Wenn man die beiden Ansätze gegeneinander abwägt, so fallen doch einige Unterschiede ins Auge. ISR bietet den Vorteil, dass sich die Webseite aktualisieren kann, während der Nutzer sie offen hat. Ein erneutes Laden der Webseite ist somit nicht notwendig, um auf dem neuesten Stand zu sein. DPR dagegen erfordert vom Nutzer, die Webseite zu aktualisieren, sofern er über Änderungen und Updates informiert sein möchte. Doch eben diese ,,Statik“ bei DPR ist auch ihre Stärke: sie ist übersichtlicher und ermöglicht dem Betreiber Änderungen ohne große Umstände. Bei ISR hingegen ist ,,debugging“ und das Einführen von Änderungen insofern problematisch, als dass jeder Nutzer auf einem anderen Stand hinsichtlich Aktualität sein kann. Während für den einen Kunde ein Produkt einen bestimmten Preis hat, könnte ein anderer einen bereits aktualisierten Preis haben. Für all diese Möglichkeiten die gleichen Änderungen durchzuführen kann kompliziert sein.