WordPress schneller machen: Lazy Loading integrieren

Lazy Loading macht vor allem dort Sinn, wo eine große Anzahl an Dateien geladen werden muss. Dies ist bei langen Artikeln mit vielen Bildern der Fall, aber auch in Artikelarchiven oder anderen längeren Auflistungen. Würden diese Dateien direkt beim Seitenaufbau geladen, blockieren sie unnötigerweise das Seitenrendering, weil der Browser auf die Daten wartet, bevor er die Seite weiter anzeigt.

Interessant ist der Einsatz von Lazy Loading auch dort, wo Inhalte von externen Seiten eingebunden oder sogar dynamisch aggregiert werden. Das geht meist mit vielen verschiedenen Domainauflösungen und entsprechenden Wartezeiten bei der Übertragung einher. Werden die externen Inhalte durch Lazy Loading erst später angefragt, entfallen auch hier wieder wertvolle (Milli)Sekunden an Wartezeit.

Die Integration von Lazy Loading kann natürlich auf verschiedene Arten erfolgen. Im WordPress Plugin-Verzeichnis finden sich viele Plugins zum Thema Lazy Load(ing). Hier ist mit der Plugin-Installation und zwei bis fünf Klicks für die Konfiguration meist schon alles getan.

Aber auch die händische Einbindung eines Lazy Loading Scripts wie zum Beispiel unveil.js ist kein allzu großes Unterfangen. Hierbei muss allerdings bedacht werden, dass die Themes in aller Regel nicht automatisch entsprechendes Markup für die Bilder generieren, so dass man hier nochmal Hand anlegen muss. Dafür wird man mit deutlich kleinerem JavaScript, und in aller Regel besseren Konfigurationsmöglichkeiten, belohnt.

So oder so lohnt die Integration von Lazy Loading, wenn eine Seite entsprechend viele Bilder oder sonstige Inhalte darstellen muss und dadurch der Aufbau verzögert würde.

Nachtrag: Wer Lazy Loading in Aktion sehen will, kann einen Blick auf den Kulturkalender der Europaregion euregio werfen. Dort ist das Ganze mittels unveil.js integriert und wird sichtbar, wenn man sehr schnell scrollt oder eine langsame Internetverbindung hat.