Animation

iFrames in Webflow später laden | PageSpeed optimieren

Level:
Einfach 👌
Das Video kann nur angezeigt werden, wenn Cookies erlaubt sind.
Cookies akzeptieren und Medien laden

Hin und wieder muss man iFrames in eine Website integrieren. Sei es für ein YouTube Video, Podcast Player oder auch eine Google Maps Karte. Das blöde dabei ist nur, dass man sich dadurch unkontrolliert viel Code mit in die Website holt, der natürlich auch geladen werden muss. Bisher haben die Browser so ein iFrame immer direkt beim Öffnen der Seite geladen. Jetzt ist es aber durch ein Attribut möglich, dieses iFrame erst zu laden, sobald der Seitenbesucher zu diesem Bereich hin scrollt (lazy-loading). Der Browser Support ist auch schon ziemlich gut und du kannst es getrost bei jedem iFrame-Embed mit dazuschreiben, da es bestimmt nicht mehr lange dauert, bis es von allen Browsern unterstützt wird.

In Webflow ist bei allen Bilder standardmäßig lazy loading aktiv. Mit diesem Trick bekommst du auch alle iFrames dazu, erst später zu laden und optimierst damit auch noch deine Ladezeit.

Ergebnis anschauen
Icon für einen externen Link
Projekt im Webflow Designer öffnen
Icon für einen externen Link