Grundsätzlich erweist es sich als wünschenswert, wenn ein Server alle Inhalte und verbundenen Content mit einer minimalen Reaktionszeit überträgt. Dies führt allerdings unter Umständen dazu, dass sämtliche Elemente inklusive unveränderlicher kleiner Bilddateien, PHP Skripten und Text oder lokaler Source Code stets als gleichwertig behandelt werden. Bestimmte Informationen überträgt der Webserver somit bei jeder Anfrage automatisch, ohne dass sie aktuell benötigt werden. Diese synchrone Übertragung kann die Ladezeit einer Webseite deutlich beeinträchtigen, weil alle statisch, dynamisch und interaktiv erzeugten Fragmente einer Website immer eine neue Verbindung aufbauen und dadurch Ressourcen wie Rechenleistung und Bandbreite belegen.
Nach welchem Prinzip arbeitet das Lazy Loading?
Bei jedem Besuch einer Website speichert ein Browser in einem ersten Schritt wichtige Basiselemente, die er anschließend wahlweise neu aus dem Internet lädt oder unmittelbar aus einem zeitlich beschränkten Cache abruft. Mit Lazy Loading – dem „gemächlichen Laden“ – aktivieren Betreiber von Webseiten unter anderem einen erweiterten lokalen Zwischenspeicher und vermeiden überflüssigen Traffic. Es dient dafür, nicht jede relevante Information unmittelbar und unverzüglich in Echtzeit verarbeiten zu müssen. Die Methode arbeitet nach folgendem Konzept, um Nutzerfreundlichkeit, Integrität der Daten und zuverlässige Kommunikation zu gewährleisten:
- Mit Lazy Loading aktiviert der Webserver zusätzlich gespeicherten Cache
- Prüfung der Sicherheit anhand existierender lokaler „Spiegel-Server (Mirrors)“ und fremden Quellen
- Optional bei Bedarf kryptografische Kontrolle der Daten durch Hash-Verfahren wie AES oder MD256
- Definiert weder das Verfahren noch Auswertung der Daten, sondern ordnet einem Programm eine feste Umgebung zu
- Speichert unveränderliche Inhalte wie Bilder oder persönliche Informationen unabhängig von dem Netzwerk
- Reduziert Ladezeiten nach dem ersten Aufruf einer Internetpräsenz bis zum Löschen von Cookies und temporären Daten
- Variable Dauer der Zwischenspeicherung und Priorisierung von Datenpaketen
- Verzögert mitunter die Aktualisierung einer Website, dient jedoch niemals Blocking auf technischer Ebene
Das „verzögerte“ beziehungsweise „träge“ oder „faule“ Laden entlastet sowohl den Arbeitsspeicher RAM wie den Prozessor und die allgemeine I/O. Letztendlich zielt das Lazy Loading auf kurze Signalwege, lokalem Speichern von Inhalten und letztendlich einer effizienten Kommunikation zwischen Client-Server ab.
Welche Vorteile besitzt Lazy Loading gegenüber dem klassischen Hosting einer Website?
Eine moderne Website besteht mittlerweile häufig aus Quelltext und hochauflösenden, speicherintensiven Multimedia-Dateien sowie eingebundenem Content, der auf einem externen Server liegt. Sie verwendet zwar standardisierte Protokolle wie HTML5 – diese sind jedoch meist weder auf Datentransfer noch -verarbeitung optimiert. Neben den relevanten Inhalten besteht bei diesen Verfahren nicht selten ein überwiegender Teil der Übertragung aus bereits vorhandenen Informationen. Das Lazy Loading bewirkt unter anderem eine stärkere Verwendung des lokalen Caches – eine Methode, die zum Beispiel das Domain Name System (DNS) bereits seit Jahrzehnten einsetzt, um mehrfache, überflüssige Anfragen zu verhindern und Ladezeiten zu reduzieren.
Zusätzlich erlaubt es Lazy Loading, bestimmte Dateien oder Inhalte zu priorisieren, damit diese bevorzugt übertragen werden. Eine typische Anwendung besteht etwa darin, bei einer statischen oder dynamischen Website zunächst wichtige Metadaten zu senden, um sie bei minimalen Ladezeiten korrekt darstellen zu können. Erst anschließend, wenn die volle Bandbreite wieder zur Verfügung steht, folgen Inhalte wie hochauflösende Bilder und Videos.
Wie lässt sich Lazy Loading auf einer Website einsetzen?
In der Vergangenheit erforderte das Lazy Loading externe Skripte beispielsweise in JavaScript. Seit dem Februar 2020 zählt es jedoch zu den offiziellen Spezifikationen von HTML und wird von allen großen Browsern wie Google Chrome, Mozilla Firefox oder Apple Safari unterstützt. Für seine Verwendung genügt seitdem die einfache Ergänzung um das Attribut loading=lazy im HTML Source Code. Dabei ist jedoch zu berücksichtigen, dass der Einsatz dieses Tags auch negative Folgen haben kann: So sind beispielsweise viele Datenbanken darauf ausgelegt, unterschiedliche Informationen in einer einzigen Abfrage zusammenzufassen. Führt das Lazy Loading dazu, eine Verbindung in mehrere separate Zugriffe zu trennen, erhöhen sich unter Umständen Ressourcenverbrauch und Ladezeiten sowohl auf dem Server wie bei dem Client.