Wie gefällt Ihnen die Extension?
Resource Hints: Preload Critical Resources & Assets für Magento 2
Resource Hints Für Magento 2
Preload Critical Resources & Assets
Verbessern Sie Ihre Core Web Vitals Page Experience KPIs und Konversionsrate, indem Sie Largest Contentful Paint (LCP) Bilder und andere wichtige Ressourcen preloaden.
Die Magento Extension Für Preload / DNS Prefetch / Preconnect / Prefetch / Early Hint Critical Resources & Assets Via Resource Hints:
- Core Web Vitals Optimierung
- Preload Hero-Images / Largest Contentful Paint (LCP) Bilder
- Preload JS / Font / CSS Dateien
- Early Hints für JS / Font / CSS Dateien (mit Cloudflare)
- DNS-Prefetches & Preconnect
Für Externe Ressourcen & Assets - Prefetch Assets
Für nachfolgende Page Views - Kompatibel Mit WebP Optimized Images & Ultimate Image Optimizer
Lizenz:
- Einmalige Zahlung - Kein Abo
- Lebenslanger Zugriff auf Quellcode
- 1 Jahr kostenfreier Support
- 1 Jahr kostenfreie Updates
Geprüft und verifiziert von Magento Marketplace
1st Extension Provider
Mit Hyvä Support
Awesome seit 2021!
Unverschlüsselt. 100% Open Source & anpassbar
Coding Standards. Sauberer & lesbarer Code
Unzählige zufriedene Kunden: Seien Sie der Nächste!
Made With Love
Unsere Extensions sind gebaut mit Liebe und Leidenschaft für neue Dinge, Perfektion und Performance.
Praxis Erprobt
Unsere Extensions sind in unseren eigenen Kundenprojekten praxiserprobt.
Kunden Feedback
Wir haben eine wirklich knifflige Anpassung einer Erweiterung in Auftrag gegeben, die andere Agenturen nicht bewältigen konnten...und die Jungs von JaJuMa haben einen fantastischen Job gemacht! Wir freuen uns, weiterhin mit JaJuMa zusammenzuarbeiten.
Wir sind sehr zufrieden mit diesem Modul. Es verkleinert die Größe unserer Bilder und somit ist das Laden unserer Seiten viel schneller geworden. Wir empfehlen dieses Modul für jeden!!!
- Extension Konfiguration
- Allgemeine Konfiguration
- Globale Preload Resourcen
- Preload LCP Bild Kategorien 1
- Preload LCP Bild Kategorie 2
- Preload LCP Bild - CMS Seite
- Preload LCP Bild Produktseite
- PageSpeed - Ohne Preload
- PageSpeed - Mit Resource Hints/ Preload
Configurations & Screenshots
Lösung
Verbessern Sie Ihre Core Web Vitals Page Experience KPIs Und Conversion-Rate indem Sie Ihre Magento 2 Seiten schneller laden.
Durch die Verwendung von Resource Hints für das
Preloading kritischer Resourcen & Assets für schnellere Ladegeschwindigkeit und
Verbesserte Largest Contentful Paint (LCP) Werte für Ihren Magento 2 Shop!
DAS PROBLEM
PAGE SPEED &
CWV & LCP
OPTIMIERUNG
Wenn Ihr Kunde Ihr Geschäft besucht, muss der Browser zunächst das HTML-Dokument herunterladen,
das HTML analysieren, um alle Ressourcen zu ermitteln, die zum Rendern der Seite erforderlich sind, und
dann diese zahlreichen zusätzlichen Ressourcen und Assets wie CSS-Dateien, JS-Dateien und Bilder herunterladen.
Dieser Prozess und das Laden all dieser vielen Ressourcen braucht Zeit. Wenn es also um Seitenladezeiten und
Leistungs-KPIs geht, ist es wichtig, kritische Ressourcen zuerst zu laden
um sicherzustellen, dass der Browser die Seite für Ihre Kunden so schnell wie möglich darstellen kann.
Dies gilt umso mehr, seit Google die neuen Core Web Vitals (CWV) KPIs zur Leistungsmessung
eingeführt hat, die sich stärker auf die Nutzererfahrung und das schnelle Rendering konzentrieren.
Zum Beispiel ist der Largest Contentful Paint (LCP), einer dieser Core Web Vitals,
in den meisten Fällen vom größten Bild above-the-fold, auch "Hero-Image" genannt, abhängig.
Daher ist es wichtig, dem Browser mitzuteilen, welche Ressourcen und Assets für das Rendering "kritisch" sind und
zuerst geladen werden sollten. Wenn man es richtig macht und den Browser dazu bringt, die
richtigen Assets zuerst herunterzuladen, ist das eine große Chance,
die Ladegeschwindigkeit der Seite zu verbessern, insbesondere in Bezug auf CWV und Largest Contentful Paint.
Lassen Sie sich diese Gelegenheit nicht entgehen, um Ihre
Website erheblich zu beschleunigen und
Ihre Performance-KPIs wie LCP zu verbessern die Teil der von Google verwendeten Ranking-Signale
für die User Experience (UX) sind.
DIE LÖSUNG
RESOURCE HINTS:
PRELOAD CRITICAL
RESOURCES & ASSETS
Sie haben bereits alle gängigen Performance-Optimierungen in Ihrem Magento 2 Shop vorgenommen,
sind aber noch nicht ganz zufrieden mit Ihren Seitenladezeiten und Performance-Werten?
Möchten Sie Ihren Largest Contentful Paint KPI optimieren,
um den Core Web Vitals Test zu bestehen?
Dann ist es an der Zeit, Ihrem Magento 2 Shop einen weiteren Geschwindigkeitsschub für
verbesserte Seitenladezeiten zu geben, indem Sie Ressourcenhinweise zum Vorladen
aller wichtigen Ressourcen und Assets auf Ihrer Website verwenden.
Vorladen über Resource-Hints ist ein Mittel, um Prioritäten zu definieren,
welche Ressourcen und Anlagen erforderlich oder wichtig sind damit der Browser eine Website so schnell wie
möglich rendern und anzeigen kann. Anstatt also den Browser zuerst das HTML herunterladen zu lassen,
dann die Ressourcen auf der Seite zu analysieren und zu entdecken und erst dann mit dem Herunterladen zu beginnen,
sagen wir dem Browser: "Hey, lieber Browser, du brauchst diese wichtige Sache in Kürze,
bitte lade sie sofort herunter". Mit diesem kleinen Trick können Sie
einige signifikante Verbesserungen in Bezug auf die Seitengeschwindigkeit und
insbesondere in Bezug auf Ihren Largest Contentful Paint (LCP) Score erzielen.
Preload Hero-Images / Largest Contentful Paint Elemente:
Die JaJuMa Preload Critical Resources & Assets Extension ermöglicht es Ihnen, das Hero-Bild /
Largest Contentful Paint Element auf jeder Ihrer Seiten individuell vorzuladen.
Sie können das entsprechende Bild sowohl für Ihre Homepage als auch für jede andere CMS-Seite in Ihrem
Magento 2-Shop konfigurieren. Für Kategorieseiten können Sie wählen, ob das Kategoriebild oder
das Bild des ersten Produkt im Grid automatisch geladen werden soll oder
ob Sie das vorgeladene Bild individuell für jede Kategorie konfigurieren möchten.
Auf Produktdetailseite wird automatisch das erste Bild in der Media Gallery vorgeladen.
Highlights
Resource Hints: Preload Critical Resources & Assets by JaJuMa-Develop
Die Magento Extension für
Preload / DNS Prefetch / Preconnect / Prefetch / Early Hints
Ihre kritischen Ressourcen und Assets über Resource Hints und für Preload des LCP Element.
Performance-Optimierung Ihres Magento 2 Shop.
Optimierung Ihrer Core Web Vitals-Werte für Largest Contentful Paint (LCP)
Preload Hero-Images / Largest Contentful Paint (LCP) Bilder
zur Core Web Vitals Optimierung
Automatisch oder
manuell konfiguriert
LCP-Bild für jede Seite vorladen
Ermöglicht DNS-Prefetches
und Preconnect
für externe Ressourcen und Assets
Globale Konfigurationen für DNS-Prefetch/Preconnect/Preload/Prefetch
von JS/CSS/Font Dateien
Unterstützt
103 Early Hints
Mit Cloudflare
Konfigurierbarer und/oder
automatischer
Largest Contentful Paint Image Preload
Core Web Vitals / Largest Contentful Paint (LCP)
Optimierung
Kompatibel mit JaJuMa WebP Optimized Images
Automatischer Preload des WebP Bild wenn verfügbar
Kompatibel mit JaJuMa Ultimate Image Optimizer
Automatischer Preload des AVIF, WebP, Responsive + High-Res & Responsive Bild wenn verfügbar
Details
Resource Hints Für Preload Critical Resources & Assets
Extension Für
Magento 2 by JaJuMa Im Detail.
Steuern Sie jetzt Ihren Magento 2 Waterfall.
Lassen Sie den Browser über Resource-Hints wissen, was wirklich wichtig ist, und laden Sie es zuerst, um Ihre Core Web Vitals zu verbessern.
Vorladen über Resource Hints kann ein mächtiges Werkzeug zur Optimierung der Seitengeschwindigkeit sein, insbesondere im Hinblick auf nutzerzentrierte KPIs
Resource Hints teilen dem Browser mit, was früher downgeloaded werden muss, weil es für das Rendern der Seite wichtig ist.
Ein typischer Kandidat für Preloading ist üblicherweise das LCP Element/Bild..
JaJuMa Preload Critical Resources & Assets ermöglicht es Ihnen, Ihr LCP-Element
auf Produktseiten, das erste Produktbild in der Mediengalerie, auf Kategorieseiten, das Kategoriebild oder
das erste Produktbild im Grid, automatisch oder über manuelle Konfigurationen für Kategorieseiten und CMS-Seiten
vorzuladen. Für Kategorie- und CMS-Seiten können Sie sogar konfigurieren, dass responsive Bilder je nach Gerät des
Kunden vorgeladen werden. Dadurch lädt der Browser nur das passende Bild vor, egal ob für Mobil- oder Desktopgeräte.
Zusätzlich können Sie mit unserer Erweiterung globale Preloads/Prefetch/Preconnects/Early Hints
für kritische Assets wie JS-, CSS- oder Font-Dateien konfigurieren, die auf alle Seiten Ihrer Website angewendet werden.
Um die Sache noch besser zu machen, wenn Sie unsere Extensions
WebP Optimized Images oder
Ultimate Image Optimizer
verwenden, wird immer das beste verfügbare Bildformat vorgeladen, WebP, AVIF und sogar Responsive & hochauflösende Bilder werden
berücksichtigt und von den Browsern automatisch heruntergeladen, wenn sie vom Gerät des Kunden unterstützt werden.
Global Resource Hints Konfigurationen
- DNS Prefetch
- Preconnect
- Preload
- Prefetch
- 103 Early Hints
Resource Hints:
DNS-Prefetching weist den Browser an, im Hintergrund eine DNS-Abfrage für die konfigurierte Domäne durchzuführen.
DNS Prefetch minimiert die Latenzzeit, da der DNS-Lookup bereits stattgefunden hat, sobald der Download einer Ressource von dieser Domain beginnt.
Resource Hints:
Preconnect weist den Browser an, im Hintergrund eine vollständige Verbindung zu der konfigurierten Domäne aufzubauen, einschließlich DNS-Lookups, TLS-Verhandlungen und TCP-Handshakes.
Preconnect minimiert die Latenzzeit, indem es kostspielige Roundtrips eliminiert, bevor der Download einer Ressource von dieser Domain beginnt.
Resource Hints:
Preload weist den Browser an, eine Ressource zu holen, die auf der aktuellen Seite verwendet wird.
Das Vorladen stellt sicher, dass z. B. eine JS/CSS-Datei oder ein Bild, die sonst erst spät entdeckt würde, bereits geladen und verfügbar ist, wenn sie für das Rendern der aktuellen Seite benötigt wird.
Resource Hints:
Prefetching weist den Browser an, eine Ressource mit niedriger Priorität abzurufen und im Cache zu speichern.
Vorabgerufene Ressourcen sind dann bereits verfügbar, wenn der Benutzer später eine Seite besucht, die diese Datei benötigt.
Resource Hints:
Weisen Sie den Browser darauf hin, eine Ressource so schnell wie möglich zu laden. Early Hints sendet Preload-Hinweise an den Browser vor einer endgültigen Antwort.
Es kann sofort mit dem Abrufen wichtiger Ressourcen (z. B. Fonts, CSS, JavaScript) begonnen werden,
noch bevor das Hauptdokument geladen wurde.
(Diese Option funktioniert nur für Websites, die über Cloudflare laufen)
Laden Sie nur Ressourcen vor, die wirklich wichtig sind. Andernfalls kann es sein, dass beim "Vorladen von allem" keine oder sogar eine negative Auswirkung entsteht.
Preload Largest Contentful Paint (LCP) Images per Layout
- Homepage / CMS Seiten
- Kategorieseiten
- Produktdetailseiten
CMS Seiten:
Für die Homepage und jede CMS-Seite ermöglicht die Extensions die manuelle Konfiguration des LCP-Elements, das vorgeladen werden soll.
Optional ist es auch möglich, responsive Bilder für die Desktop- und Mobile-Ansicht vorzuladen.
seiten:
Wie bei CMS-Seiten können Sie das LCP-Element für Kategorieseiten manuell konfigurieren, einschließlich responsiver Bilder.
Wenn kein Bild manuell konfiguriert wird, können Sie alternativ das Bild der Kategorie oder das Bild des ersten Produkt im Grid automatisch vorladen lassen.
seiten:
Für Produktdetailseiten können Sie aktivieren, dass das erste Produktbild in der Mediengalerie automatisch vorgeladen wird.
Diese Extension ist kompatibel mit WebP Optimized Images und Ultimate Image Optimizer Extensions. Wir empfehlen, diese Extension zusammen mit einer dieser beiden Erweiterungen zu verwenden. Wenn diese Extensions installiert sind, wird das beste verfügbare Bildformat (WebP, AVIF, Responsive & High-Res) automatisch vorgeladen.
Schreiben Sie Ihre Bewertung
Frequently Asked Questions
Changelog
Version: 1.0.0
- Initial Release
Version: 1.0.1
- Bugfix: Update db_schema.xml
Version: 1.0.2
- Added: Option to enable/disable preload high-res images on PDP
Version: 1.0.3
- Added: Compatibility with Ultimate Image Optimizer v3, incl. preloading responsive images
- Added: Early Hints (only for sites running on Cloudflare)
Mehr Extensions
Vielleicht auch interessant für Sie?
Weitere wertvolle Extensions und Add-Ons für Ihren Magento-Shop