Magento 2 Lazy Loading für Bilder und iframes
SKU: LAZYLOADINGIMAGES1
- Bilder und iframes laden erst beim Scrollen
- LCP-Bild und erste Bilder bleiben ausgenommen
- Platzhalter und feste Maße gegen Layoutsprünge
- Ausnahmen per CSS-Klasse, Seite oder Bereich
Einmaliger Kauf · inkl. 12 Monate Updates · zzgl. MwSt.
Magento 2 Lazy Loading: schnell laden, ohne das wichtigste Bild zu bremsen
Mit Magento 2 Lazy Loading von Mironsoft laden Bilder und iframes Ihres Shops erst, wenn der Besucher sie fast erreicht hat. Das spart Daten und beschleunigt die erste Anzeige. Das wichtigste Bild oberhalb der Falz, das LCP-Bild, bleibt ausgenommen und wird sogar bevorzugt geladen. Das Modul ergänzt, was Hyvä im Template schon tut, um Inhalte aus CMS, Blog und Drittanbieter-Blöcken.
Bilder nachladen
Bilder außerhalb des sichtbaren Bereichs laden erst, wenn der Besucher kurz vor ihnen steht.
iframes und Videos
Eingebettete Karten und Videos werden erst geladen, wenn sie in Sicht kommen, und sparen so Anfragen.
LCP-Ausnahme
Das größte Bild im ersten Bildschirm wird sofort geladen und mit hoher Priorität ausgeliefert.
Platzhalter
Bis das Bild da ist, steht ein Platzhalter in Farbe oder als Rahmen im vorgesehenen Format.
Feste Maße
Fehlen Breite und Höhe im Bild, ergänzt das Modul sie, damit der Text nicht springt.
Regeln und Ausnahmen
Ausnahmen legen Sie per CSS-Klasse, Seitentyp oder Layout-Handle fest.
Warum Magento 2 Lazy Loading die Ladezeit spürbar entlastet
Produktlisten, Blogartikel und CMS-Seiten enthalten oft dutzende Bilder. Lädt der Browser alle sofort, konkurrieren sie um dieselbe Bandbreite wie das wichtigste Bild und das Skript für die Seite. Besucher auf dem Handy warten länger, obwohl sie die unteren Bilder noch gar nicht sehen. Deshalb suchen Händler nach Magento 2 Lazy Loading, nach einer Möglichkeit, Magento 2 Bilder nachladen zu lassen, oder nach Lösungen für Ladezeitprobleme in Google PageSpeed.
Wichtig ist die Reihenfolge. Wer pauschal alles nachlädt, verzögert auch das LCP-Bild und verschlechtert den Wert, den Lazy Loading eigentlich verbessern sollte. Magento 2 Lazy Loading mit Ausnahmeregeln trennt deshalb klar: Was sofort sichtbar ist, lädt zuerst; alles darunter folgt später.
Magento 2 Lazy Loading für Bilder: nur laden, was sichtbar wird
Das Modul ergänzt Bildern im Ausgabe-HTML das passende Nachlade-Verhalten. Im Normalfall setzt es das native Browser-Attribut und ergänzt einen Abstand, sodass das Bild schon kurz vor dem Sichtbereich zu laden beginnt. Das gilt für Inhalte aus CMS-Blöcken, Blogartikeln, Page-Builder-Elementen und Produktbeschreibungen, die ein Theme nicht selbst bearbeitet. Browser ohne Unterstützung zeigen das Bild einfach sofort an; ein noscript-Fallback sorgt dafür, dass es nie fehlt.
- Native Browser-Funktion, kein zusätzliches Script nötig
- Vorlaufabstand in Pixeln einstellbar
- Fallback für Browser ohne Unterstützung
Das LCP-Bild beim Magento 2 Lazy Loading ausnehmen
Das Largest Contentful Paint ist meist ein großes Bild im oberen Seitenbereich. Es darf niemals nachladen. Das Modul nimmt deshalb die ersten Bilder jeder Seite aus, deren Zahl Sie festlegen, und kann dem wichtigsten Bild zusätzlich eine hohe Abrufpriorität geben. Wo das LCP-Bild nicht das erste ist, markieren Sie es per CSS-Klasse. Eine Ausnahme je Seitentyp, etwa Startseite oder Produktseite, ist ebenfalls möglich.
- Erste N Bilder pro Seite sofort laden
- Hohe Priorität für das wichtigste Bild
- Ausnahme per CSS-Klasse oder Seitentyp
iframes und eingebettete Inhalte beim Magento 2 Lazy Loading nachladen
Eingebettete Karten, Videos und Formulare ziehen oft mehr Daten als das ganze Seitenlayout. Das Modul stellt iframes auf Nachladen um und zeigt bis dahin einen Platzhalter mit dem gewünschten Seitenverhältnis. Bei Videos aus Fremdportalen kann ein Klick auf den Platzhalter den Player erst laden. Das schont die Ladezeit und verhindert, dass beim Seitenaufruf Verbindungen zu fremden Servern geöffnet werden. Ob dafür eine Einwilligung nötig ist, bewertet der Shopbetreiber.
- iframes laden erst im Sichtbereich
- Platzhalter im festen Seitenverhältnis
- Optional erst nach Klick auf den Platzhalter
Platzhalter und feste Maße gegen Layoutsprünge
Springt der Text, weil ein Bild nachträglich Platz beansprucht, verschlechtert das den Wert für die Layoutstabilität. Das Modul liest Breite und Höhe aus der Bilddatei, ergänzt fehlende Angaben und reserviert den Platz. Als Platzhalter dient eine neutrale Farbe oder ein Rahmen. Schlägt das Laden fehl, bleibt der Platzhalter stehen, und die Seite verschiebt sich nicht. Die Regeln gelten je Store View und lassen sich auf einzelne Seitentypen begrenzen.
- Breite und Höhe werden ergänzt, wenn sie fehlen
- Neutrale Farbe oder Rahmen als Platzhalter
- Konfiguration je Store View und Seitentyp
Wo Magento 2 Lazy Loading im Shop-Alltag hilft
Typische Seiten mit vielen Bildern und eingebetteten Inhalten.
Kategorieseiten mit langen Listen
Mit Magento 2 Lazy Loading laden Produktbilder weit unten erst beim Scrollen. Die ersten Zeilen erscheinen sofort, die Seite fühlt sich schneller an.
Blog und Ratgeber
Lange Artikel mit vielen Bildern und eingebetteten Videos entlasten den ersten Seitenaufruf, ohne dass die Leser etwas vermissen.
CMS-Seiten mit Page Builder
Banner, Teaser und Galerien aus dem Page Builder bekommen das Nachladen auch dann, wenn das Theme sie nicht selbst behandelt.
Seiten mit Karten und Videos
Eine eingebettete Karte im Seitenfuß lädt erst, wenn der Besucher dorthin scrollt, und blockiert nicht den Start.
Magento 2 Lazy Loading im Vergleich: ohne und mit Modul
Der Unterschied zu allem sofort laden oder pauschal alles nachladen.
| Thema | Ohne Modul | Mit Mironsoft Lazy Loading Images |
|---|---|---|
| Bilder unten | Laden sofort und bremsen | Laden beim Erreichen |
| LCP-Bild | Pauschales Nachladen verzögert es | Ausgenommen und priorisiert |
| iframes | Laden beim Seitenaufruf | Laden im Sichtbereich oder nach Klick |
| Layoutsprünge | Bild schiebt Text nach unten | Platz reserviert |
| Kontrolle | Alles oder nichts | Ausnahmen nach Klasse, Seite oder Anzahl |
So richten wir Magento 2 Lazy Loading für Sie ein
Der Ablauf nach Ihrer Beauftragung.
Messen
Wir erfassen die aktuelle Ladezeit der wichtigsten Seitentypen als Vergleichswert.
Installation
Wir installieren Magento 2 Lazy Loading und legen Ausnahmen für LCP-Bilder fest.
Platzhalter
Wir stimmen Platzhalterfarbe, Seitenverhältnisse und iframe-Verhalten mit Ihnen ab.
Test
Wir prüfen Kategorie, Produkt, Startseite, Blog und mobile Ansicht auf fehlende Bilder und Sprünge.
Übergabe
Ihr Team erhält die Liste der Einstellungen und weiß, wo Ausnahmen ergänzt werden.
Abgrenzung zu Bildoptimierung und Cache
Magento 2 Lazy Loading steuert nur, wann ein Bild geladen wird. Es ändert weder das Format noch die Größe der Datei und ersetzt keine Bildkomprimierung, kein WebP und kein CDN. Auch der Seitencache bleibt unverändert; das Modul arbeitet mit Magentos Seitencache zusammen und erzeugt keine eigene Zwischenspeicherung.
Am meisten bringt die Kombination: kleine Dateien, ein schneller Cache und gezieltes Nachladen. Das Modul läuft ohne jQuery und ohne Zusatz-Script im Hyvä Theme.
Kein Download, sondern persönliche Einrichtung
Lazy Loading Images ist hier nicht als fertige Download-Datei zum Selbst-Installieren gelistet. Der Kauf ist eine Beauftragung: Wir melden uns nach dem Kauf, installieren das Modul in Ihrem Shop und stimmen Ausnahmen, Platzhalter und iframe-Verhalten gemeinsam mit Ihnen ab.
Häufige Fragen
Alles Wichtige zu Nachladen, LCP, iframes und zum Ablauf des Kaufs.
Wie kann ich in Magento 2 Lazy Loading für Bilder aktivieren?
Wie kann ich in Magento 2 das LCP-Bild vom Lazy Loading ausnehmen?
Wie kann ich in Magento 2 iframes lazy laden?
Verhindert Magento 2 Lazy Loading Layoutsprünge?
Was passiert in Browsern ohne Unterstützung?
Werden auch Bilder aus CMS-Blöcken und dem Blog nachgeladen?
Kann ich Lazy Loading je Store View oder Seitentyp abschalten?
Funktioniert Magento 2 Lazy Loading mit Hyvä?
Ersetzt das Modul die Bildkomprimierung?
Kann ich das Modul selbst herunterladen und installieren?
Zuletzt angesehene Artikel
Magento 2 Lazy Loading – Mironsoft Lazy Loading Images