„Lazy Loading“ steht für verzögertes Laden. (wörtlich „faules, müßiges Laden“)

Das verzögerte Laden ist eine Technik, die das Laden von Ressourcen zum Laden der Seite verzögert. Stattdessen werden diese unkritischen Ressourcen zum Zeitpunkt des Bedarfs geladen. Wenn es um Bilder geht, die vom Nutzer nicht sofort benötigt werden oder zunächst beim Laden der Seite außerhalb des sichtbaren Bereiches liegen und somit dem Nutzer im Browser sowieso nicht sofort angezeigt werden.

Das Gegenteil von „Lazy Loading“ wird als „eager loading“ bezeichnet; hierbei werden möglichst effizient sofort alle absehbar benötigten Daten geholt.

Vorteile von Lazy Loading

Durch das verzögerte Laden der Inhalte werden Ladezeiten für den Nutzer „spürbar“ verkürzt. Dadurch, dass zunächst nur die Seiteninhalte geladen werden die den Nutzer sofort benötigt bzw. im sichtbaren Bereich („above the fold“) liegen, lädt die Seite deutlich schneller was zu einer besseren Usability bzw. User Experience führt. Scrollt der Nutzer nun weiter werden immer nur die Inhalte „Häppchenweise“ geladen die benötigt werden. Somit werden mehrfach kleine Datenmengen – für den Nutzer kaum spürbar – nachgeladen.

Nachteile von Lazy Loading

Lazy Loading ist oft ein Versuch, die Zahl der Datenzugriffe zu minimieren, jedoch meist zu Lasten der Effizienz bei mehreren Zugriffen. Werden sehr viele Werte oder Unterobjekte benötigt und per Lazy Load geladen, indem beispielsweise im Programm der Objektbaum durchlaufen und die Werte und Objekte so initialisiert werden, kommt es zu einer großen Zahl von Einzelabfragen. Viele Datenquellen, wie Datenbanken, sind dafür konzipiert, mit möglichst wenigen Anfragen viele Daten zu bearbeiten und komplette Ergebnisse zurück zu liefern. Werden viele Datensätze statt mit wenigen, beschreibenden Abfragen mit einer Vielzahl von Einzelabfragen ausgelesen, ist das für die Datenquellen und Netzwerkstruktur oft eine erhebliche Belastung. Im Datenbank-Kontext wird daher auch vom SELECT N+1-Problem gesprochen: mit einer (1) Abfrage werden zunächst N Objekte geladen; dann werden für jedes dieser Objekte, also N mal, einzelne Abfragen für abhängige Werte und Objekte abgerufen.

Implementierung

Verzögerte Initialisierung (lazy initialization) wird meist mit Eigenschaften (properties) im Programmcode realisiert; diese sind, von außen betrachtet, Werte oder Objekte, wobei erst bei deren Abfrage oder Veränderung der initialisierende Programmcode ausgeführt wird. So führt dann der Abruf eines erwarteten Inhalts einer Eigenschaft zur Ausführung dieses Initialisierungscodes, der diesen Inhalt tatsächlich beschafft, z. B. aus einer Datenbank.Virtueller Proxyein nach außen gleiches Objekt mit gleicher Schnittstelle steht an Stelle des echten Objekts; bei der ersten Verwendung beschafft es die nötigen Daten und stellt sie bereit, bzw. wird ersetzt durch ein vollwertiges Objekt.Geist (Ghost)Spezialform eines Proxy, die einzelne, bekannte Eigenschaften des zu holenden Datenobjekts von Anfang an beinhaltet (z. B. ID-Nummer), so dass er eingeschränkt verwendet werden kann, ohne die echten Daten holen zu müssen. Es ist somit ein sogenannter „Value holder“ ein Hilfsobjekt, das die verzögerte Datenbeschaffung verwaltet und Daten bei Bedarf ausgibt, so dass es z. B. hinter den Wert-Eigenschaften eines Datenobjekts stehen und für dieses im Hintergrund die Werte bereitstellen kann.

Mehr Informationen sowie Source-Code Snippets zur Implementierung findet man auf der Google Developer Page.

Was gibt es zu beachten?

Falls das „Lazy Loading“ nicht korrekt implementiert wird, kann es ungewollt dazu kommen, dass Inhalte für Google nicht mehr sichtbar sind und somit auch nicht indexiert werden.

Damit sämtliche Inhalte auf deiner Seite für den Googlebot sichtbar sind, müssen alle relevanten Inhalte für die Lazy-Loading-Implementierung dann geladen werden, wenn sie im Darstellungsbereich sichtbar sind. Hierfür zwei Beispiele: