Mit der neuen Divi- Version haben Sie die ultimative Leistung eines mächtigen Page Builders. Jetzt ist Divi leichter und verfügt über integrierte Funktionen zum Entfernen von Blähungen. Sie können die Anti-Bloat-Funktionen von Divi verwenden, um Ihre Website zu beschleunigen. Dies ist ein kleiner Teil des massiven Leistungsoptimierungsverfahrens von Divi, mit dem Sie den ultimativen Google Page Speed Score erzielen können.
Heute werden 4 Anti-Bloat-Funktionen besprochen -
- Dynamisches Modul-Framework
- Dynamisches CSS
- Dynamische Symbole
- JavaScript-Optimierung mit dynamischen JavaScript-Bibliotheken
Lass uns nicht mehr Zeit verschwenden und sehen, wie viel mehr Divi für uns hat.
Divi-Lösung für Blähungsproblem
Definition von Website-Aufblähungen
Jede statische Webseite aus allgemeinem HTML und CSS mit komplexem JavaScript-Code, die die Seite schwerer gemacht hat, als sie sollte, wird als Web-Bloat bezeichnet. Da Webseiten einfach markierter Text sind, sollten sie nur wenige Kilobytes beanspruchen. Aber kritische Seitenelemente wie Pop-ups, Bewegungseffekte und grafische Animationen machen die Seite schwer.
Erstellen Sie erstaunliche Websites
Mit dem besten kostenlosen Seite Builder Elementor
Jetzt anfangenWordPress-Themes wie Divi verwenden dynamisch HTML-Seiten, die auf PHP-Dateien gerendert werden. Hier müssen wir also die Größe und Effizienz von PHP-Dateien als Web Bloat betrachten.
Einfach ineffizient mehr Dateien auf eine Seite zu laden, die unnötig sind und die Seite überladen macht als nötig - bedeutet, dass die Website aufgebläht wird.
Wie es sich auf die Geschwindigkeit einer Website auswirkt
Wenn eine Seite mehr ungewöhnliche Back-End-Dateien laden muss als auf der Seite, dauert das Laden länger. Es gibt zum Beispiel eine Seite, die nur 100 Zeilen CSS benötigt, aber die Seite hat mehr als 2000 Zeilen Code, was bedeutet, dass die Ladezeit von 1800 Zeilen eine totale Verschwendung ist.
Angenommen, Sie verwenden 5 JavaScript-Bibliotheken, um eine Seite Ihrer Website auszuführen, auf der Sie die gesamte Arbeit mit 1 erledigen können. Es macht also keinen Sinn, 4 nutzlose JavaScript-Bibliotheken zu verwenden. Beachten Sie, dass eine JavaScript-Bibliothek Tausende von Codezeilen enthält.
Abgesehen von CSS und Js läuft Ihre Webseite auf einer PHP-Datei, die eine Vielzahl von Funktionen enthält. Nehmen wir an, Ihre function.php hat 20.000 Zeilen Code und Hunderte von Funktionen. Das Bereitstellen von Inhalten auf einer bestimmten Seite führt all dies aus – das ist völlig unnötig, wenn nur wenige davon benötigt werden.
Aufblähen von Problemlösungen in Divi
Das Design des Divi wird von Tag zu Tag moderner. Nach und nach nahm auch das Blähungsproblem zu. Um dies zu lösen, wurde eine neue Funktion namens "Anti-Bloat"-Logik angewendet, die dieses Problem vollständig beseitigen kann. Mit dieser Anti-Bloat-Funktion ist Divi jetzt viel schneller als zuvor und Benutzer können ihre Aktivitäten viel effizienter fortsetzen.
Was ist in dieser Anti-Bloat-Funktion?
Divis "Anti-Bloat"-Funktion erfüllt 4 Hauptrollen für bestimmte Seiten -
Dynamic Module Framework: Es behebt Probleme, die durch PHP-Dateien erstellt wurden, indem es sie optimiert. Somit funktionieren nur die Funktionen und Codes, die zum Ausführen einer Seite erforderlich sind, aktiv für diese Seite.
Dynamisches CSS: Es erstellt ein benutzerdefiniertes Stylesheet, das nur aus CSS-Codes besteht, die zum Laden einer Seite benötigt werden. Keine Ladezeit für zusätzliche CSS-Dateien.
Dynamische Javascript-Bibliotheken: Es optimiert und erstellt dynamisch eine Datei script.js, die die externe JS-Bibliothek lädt, die für die Seite benötigt wird.
Dynamische Symbole: Es wird eine Teilmenge der auf der Seite verwendeten Symbole geladen, nicht alle Symbole, die für die Website verwendet werden.
Aktivieren Sie diese Funktion, indem Sie in Divi . navigieren 
So funktionieren Anti-Bloat-Funktionen
Wie wir bereits wissen, hat Divi eine neue Funktion namens "Anti-Bloat" eingeführt, um die Ladezeit von Seiten zu reduzieren, die durch irrelevante Codezeilen auftritt. Sehen wir uns an, wie diese Funktion funktioniert.
Dynamisches PHP-Framework: Funktionen
Divi folgt hier einer einfachen Regel, die nur die Funktionen ausführt, die benötigt werden. Es ist eine vollständige Beweislogik, die diese Aktion ausführt.
Vorbearbeitungsprüfung
Die Bereitstellung von Daten von Ihrem Server an Ihre Website mit dynamischem PHP ist sehr einfach und zeitsparend. Wenn es feststellt, dass eine Komponente oder Funktion verwendet wird, führt es eine Geschwindigkeitsprüfung des Systems durch und ruft alle Codes ab, die dieses Element unterstützen, und liefert sie entsprechend aus und wird nicht ausgeführt, bis die Aktion abgeschlossen ist.
Module auf Anfrage
Mit dieser neuen Funktion können Seiten Module flexibel laden. Aufgrund der Anti-Bloating-Logik von PHP verarbeitet Divi nur die Shortcodes, die die Seite benötigt. Wenn Sie also beispielsweise 5 Module auf einer Seite haben, verarbeitet Divi nur diese fünf, nicht alle, und zeigt diese fünf Module an und gibt sie aus.
Funktionen auf Abruf
Für jedes Feature auf einer Seite verarbeitet und lädt Divi automatisch Module. Genauer gesagt verarbeitet dieses System nur Module wie Bildlaufeffekte, Animationen, Rahmen und Sticky-Optionen, die auf der Seite verwendet werden. Dies gilt auch für Abschnitte, Zeilen und Spalten.
Daynamic-CSS
Das Divi-Stylesheet behält auch die Anti-Bloat-Logik bei, die im PHP-Framework verwendet wurde. Die Divi-CSS-Funktionalität ist ziemlich umfangreich und erzeugt oft unnötige Blähungen auf Seiten.
CSS-Laden basierend auf Seite
Das passiert, wenn eine Seite CSS dynamisch lädt,
- Es lädt nur CSS-Dateien, die das Divi-Theme formatieren müssen. Die Dateigröße beträgt nicht mehr als 50kb.
- Dann lädt es CSS-Dateien, die das Designdiagramm für die Seite enthalten. Es werden nur die Dateien dynamisch geöffnet, die in verschiedenen Abschnitten der Seite verwendet werden. Für eine einfache Homepage gibt es beispielsweise nur eine 30-KB-Datei.
Hier sind es jetzt 80 KB CSS-Datei ohne Aufblähen. Vorher war die Größe 900kb und fast voller Blähungen.
Hier wurde diese Homepage mit dem Divi Builder erstellt und Sie können sehen, wie native CSS-Dateien für diese Seite in Aktion sind, um Seitenkomponenten anzuzeigen.
Dynamisches JavaScript
Wir verwenden im Allgemeinen JavaScript, um die Leistung der Website zu verbessern, unsere Designs zu vereinfachen und zu modernisieren. Mit dynamischem JavaScript kann Divi Js-Funktionen aus einer externen Bibliothek importieren. Es wird also weniger komplexe Codierung auf der Seite geben und die Seite wird sicherlich leichter und schneller als zuvor sein. Anti-Bloat-Funktionen funktionieren pro Seite, sodass Sie sich keine Sorgen über Funktionsschäden machen müssen, Divi kümmert sich darum.
Hier ist ein kleines Beispiel dafür, wie Lightbox- und Sticky-Funktionen von der Divi-Anti-Bloat-Funktion übernommen werden.
Dynamische Symbole
Icons sind ein sehr wichtiger Teil einer Webseite. Divi ermöglicht eine intelligente Möglichkeit, Teilmengen von Schriftarten zu laden, die für diese Seite erforderlich sind, anstatt alle Symbole zu laden. Grundsätzlich hat jede Webseite drei Untergruppen von Symbolen,
- Basis - Standardsymbole des Divi-Themas aus dem Modul.
- Sozial - Soziale Medien folgen den Symbolen aus dem Basissymbolsatz.
- Alle - Gesamtes Symbolpaket, in dem die Symbolauswahl das gewünschte auswählen und verwenden kann.
Wenn eine Seite keine Social-Media-Module oder Symbole verwendet, die von der Symbolauswahl ausgewählt wurden, verwendet die Seite einen Basissymbolsatz, der 6 KB Speicherplatz benötigt. Die Größe wird etwas höher, wenn wir Social-Media-Symbole einbinden.
Wenn wir ein Symbolauswahl- / Klappenmodul verwenden, kann die gesamte Symbolsatzgröße bis zu 90 KB betragen.
Einpacken
Die Anti-Aufblähungs-Funktion von Divi ist definitiv sehr nützlich. Dies wird die Divi- Websites schneller machen und die Benutzererfahrung erheblich verbessern. Durch die Bereitstellung von mehr Leistung und Geschwindigkeit auf der Divi- Website erhalten Benutzer ständig besseren Support. Hoffentlich werden diese Bemühungen fortgesetzt. Wenn Ihnen dieser Beitrag gefällt, teilen Sie ihn mit Ihren Freunden und teilen Sie uns Ihre Frage im Kommentarbereich mit.
